@font-face {
    font-family: 'IBM Plex Sans';
    src: url('../fonts/IBMPlexSans-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'IBM Plex Sans';
    src: url('../fonts/IBMPlexSans-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'IBM Plex Sans';
    src: url('../fonts/IBMPlexSans-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'IBM Plex Sans';
    src: url('../fonts/IBMPlexSans-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'JetBrains Mono';
    src: url('../fonts/JetBrainsMono-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'JetBrains Mono';
    src: url('../fonts/JetBrainsMono-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body {
    height: 100%;
}

body {
    font-family: 'IBM Plex Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    background-color: #1a1a1a;
    color: #ccc;
    min-height: 100vh;
    overflow-x: hidden;
}



.bg-orbs {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.bg-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
}

.bg-orb--green {
    width: 700px;
    height: 700px;
    background: radial-gradient(circle, rgba(0, 160, 80, 0.045), transparent 70%);
    top: -260px;
    right: -120px;
}

.bg-orb--blue {
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(10, 120, 220, 0.035), transparent 70%);
    bottom: -240px;
    left: -120px;
}

.bg-orb--purple {
    display: none;
}

.bg-orb--amber {
    display: none;
}


.auth-section {
    z-index: 4;
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 40px 16px;
}


.auth-card {
    width: 100%;
    max-width: 420px;
    background:
        linear-gradient(160deg, rgba(20, 22, 20, 0.99) 0%, rgba(12, 14, 12, 1) 100%);
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-top: none;
    border-radius: 16px;
    padding: 0 0 36px;
    backdrop-filter: blur(60px);
    -webkit-backdrop-filter: blur(60px);
    overflow: hidden;
    box-shadow:
        0 0 0 1px rgba(0, 200, 80, 0.08) inset,
        0 80px 160px rgba(0, 0, 0, 0.95),
        0 24px 60px rgba(0, 0, 0, 0.7),
        0 0 120px rgba(0, 140, 60, 0.05);
}

.auth-card::before {
    display: none;
}


.auth-card-inner {
    padding: 36px 40px 0;
}


.auth-logo {
    text-align: center;
    margin-bottom: 28px;
    padding-bottom: 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    position: relative;
}

.auth-logo::after {
    display: none;
}

.auth-logo-img {
    max-width: 200px;
    width: 100%;
    height: auto;
    display: block;
    margin: 0 auto 10px;
    mix-blend-mode: screen;
    -webkit-user-drag: none;
    user-select: none;
    pointer-events: none;
    opacity: 0.92;
}

.auth-tagline {
    font-family: 'IBM Plex Sans', sans-serif;
    font-size: 12px;
    color: rgba(200, 160, 60, 0.75);
    letter-spacing: 0.02em;
    text-transform: none;
    margin-top: 6px;
    font-weight: 500;
    font-style: italic;
    line-height: 1.4;
}


.alert {
    padding: 12px 14px;
    margin-bottom: 16px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.4;
}

.alert-danger,
.alert-error {
    background: rgba(200, 50, 50, 0.1);
    border-color: rgba(180, 50, 50, 0.4);
    color: #e8a0a0;
}

.alert-success {
    background: rgba(0, 200, 80, 0.08);
    border-color: rgba(0, 200, 80, 0.3);
    color: #80d8a0;
}

.alert-warning {
    background: rgba(200, 160, 0, 0.08);
    border-color: rgba(200, 160, 0, 0.3);
    color: #d4b060;
}

.alert-info {
    background: rgba(10, 170, 255, 0.08);
    border-color: rgba(10, 170, 255, 0.3);
    color: #80c0e8;
}


.form-group {
    width: 100%;
    margin-bottom: 16px;
}

.form-group__wrapper {
    display: block;
    width: 100%;
}


.form__label {
    display: block;
    margin-bottom: 7px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #00c850;
}

.form__label-optional {
    font-family: 'IBM Plex Sans', sans-serif;
    font-weight: 400;
    color: rgba(0, 200, 80, 0.25);
    text-transform: none;
    letter-spacing: 0;
    font-size: 11px;
}


.form__input {
    display: block;
    width: 100%;
    height: 46px;
    padding: 12px 14px;
    font-size: 14px;
    line-height: 1.4;
    color: #d0d0d0;
    background-color: rgba(6, 8, 6, 0.85);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-left: 2px solid rgba(0, 200, 80, 0.15);
    border-radius: 8px;
    outline: none;
    font-family: 'IBM Plex Sans', sans-serif;
}

.form__input::placeholder {
    color: #2e2e2e;
    font-style: italic;
}

.form__input:focus {
    border-color: rgba(255, 255, 255, 0.10);
    border-left: 2px solid rgba(0, 220, 90, 0.8);
    color: #f0f0f0;
    box-shadow: -3px 0 12px rgba(0, 200, 80, 0.08), 0 0 0 1px rgba(0, 200, 80, 0.06) inset;
    background-color: rgba(8, 12, 8, 0.95);
}

.form__input.error {
    border-left-color: rgba(220, 60, 60, 0.8);
    border-color: rgba(180, 40, 40, 0.35);
}


.totp-input {
    text-align: center;
    font-size: 14px;
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 0.25em;
    font-weight: 700;
    height: 46px;
    padding: 0 12px;
    color: rgba(0, 220, 90, 0.9);
    border-left: 2px solid rgba(0, 200, 80, 0.4);
}

.totp-input::placeholder {
    letter-spacing: 0.2em;
    color: #252525;
    font-weight: 400;
    font-size: 13px;
    font-style: normal;
}

.totp-input:focus {
    color: rgba(0, 255, 110, 1);
    border-left-color: rgba(0, 255, 110, 0.9);
    box-shadow: -3px 0 16px rgba(0, 220, 90, 0.12), 0 0 0 1px rgba(0, 200, 80, 0.08) inset;
}


.captcha-wrapper {
    margin-bottom: 16px;
}

.captcha-label-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.captcha-label-row .form__label {
    margin-bottom: 0;
    flex-shrink: 0;
}

.captcha-image-row {
    display: contents;
}

.captcha-img {
    display: block;
    height: auto;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 6px;
    background: #0a0a0a;
}

#id_captcha_1,
.captcha input[type="text"] {
    display: block;
    width: 100%;
    height: 46px;
    padding: 12px 14px;
    font-size: 14px;
    color: #d0d0d0;
    background-color: rgba(6, 8, 6, 0.85);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-left: 2px solid rgba(0, 200, 80, 0.15);
    border-radius: 8px;
    outline: none;
    font-family: 'IBM Plex Sans', sans-serif;
}

#id_captcha_1:focus,
.captcha input[type="text"]:focus {
    border-color: rgba(255, 255, 255, 0.10);
    border-left: 2px solid rgba(0, 220, 90, 0.8);
    color: #f0f0f0;
    box-shadow: -3px 0 12px rgba(0, 200, 80, 0.08), 0 0 0 1px rgba(0, 200, 80, 0.06) inset;
    background-color: rgba(8, 12, 8, 0.95);
}

#id_captcha_1::placeholder,
.captcha input[type="text"]::placeholder {
    color: #2e2e2e;
    font-style: italic;
}


.form__checkbox-label {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: #666;
    cursor: pointer;
    font-weight: normal;
    line-height: 1.4;
}

.form__checkbox-label input[type="checkbox"] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    cursor: pointer;
    accent-color: #3a8a5c;
    background: #080808;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 3px;
}

.form__checkbox-label a {
    color: #3a8a5c;
    text-decoration: none;
}

.form__checkbox-label a:hover {
    color: #5aaa78;
    text-decoration: underline;
}


.form-buttons {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 6px;
}

.button {
    display: inline-block;
    cursor: pointer;
    outline: none;
    text-decoration: none;
    font-family: inherit;
}

.form__button {
    display: block;
    width: 100%;
    height: 48px;
    padding: 0 20px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 8px;
    line-height: 48px;
    position: relative;
    overflow: hidden;
}

.form__button--primary {
    background: linear-gradient(135deg, #0c8a4e 0%, #065e36 100%);
    color: #c8ffd8;
    border-color: rgba(0, 220, 90, 0.20);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.06) inset,
        0 4px 16px rgba(0, 160, 70, 0.30),
        0 1px 4px rgba(0, 0, 0, 0.5);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}

.form__button--primary:hover {
    background: linear-gradient(135deg, #0fa85e 0%, #087844 100%);
    color: #ffffff;
    text-decoration: none;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.10) inset,
        0 6px 24px rgba(0, 180, 80, 0.40),
        0 2px 6px rgba(0, 0, 0, 0.4);
}

.form__button--primary:active {
    box-shadow: 0 2px 8px rgba(0, 160, 70, 0.25);
}

.form__button--secondary {
    background: transparent;
    color: rgba(255, 255, 255, 0.25);
    border-color: rgba(255, 255, 255, 0.10);
}

.form__button--secondary:hover {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.50);
    text-decoration: none;
}


.auth-footer-link {
    text-align: center;
    margin-top: 18px;
    font-size: 13px;
    color: #999;
}

.auth-footer-link a {
    color: #00aa55;
    text-decoration: none;
}

.auth-footer-link a:hover {
    color: #00ff88;
    text-decoration: underline;
}

.form-footer {
    text-align: center;
    margin-top: 18px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.45);
    letter-spacing: 0.05em;
}

.form__hint {
    margin-top: 5px;
    font-size: 11px;
    color: #888;
    letter-spacing: 0.2px;
}


.auth-divider {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 6px 0;
    color: #2a2a2a;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.auth-divider::before,
.auth-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #1e1e1e;
}


@media (max-width: 480px) {
    .auth-card {
        padding: 28px 20px 22px;
        border-radius: 16px;
    }

    .auth-site-title {
        font-size: 22px;
        letter-spacing: 2px;
    }

    .auth-logo-icon {
        width: 44px;
        height: 44px;
        font-size: 18px;
    }

    .form__button {
        height: 46px;
        line-height: 46px;
        font-size: 12px;
    }

    .auth-card-inner {
        padding: 28px 24px 0;
    }

    .auth-section {
        padding: 30px 10px;
    }

    .auth-official-domains {
        padding: 14px 24px 0;
        gap: 4px 8px;
    }

    .auth-official-domains__link {
        font-size: 10px;
    }

    .theme-form {
        top: 12px;
        right: 12px;
    }

    .lang-switcher-auth {
        top: 12px;
        right: 62px;
    }

    .theme-toggle-label,
    .lang-trigger-auth {
        width: 40px;
        height: 40px;
        min-width: 40px;
    }

    .lang-trigger-auth {
        font-size: 10px;
        padding: 0 8px;
    }

    .onion-banner-login {
        font-size: 10px;
        padding: 7px 10px;
    }
}


a {
    color: #3a8a5c;
    text-decoration: none;
}

a:hover {
    color: #5aaa78;
    text-decoration: underline;
}



.bg-props {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}

@media (min-width: 960px) {
    .bg-props {
        display: block;
    }
}

.prop-multiple-cards {
    position: absolute;
    top: 1%;
    right: 15%;
    width: 330px;
    height: auto;
    opacity: 0.88;
    display: block;
    transform: rotate(-7deg);
    filter: drop-shadow(0 12px 32px rgba(0, 0, 0, 0.9)) drop-shadow(0 4px 10px rgba(0, 0, 0, 0.7));
}

.prop-chase-sapphire {
    position: absolute;
    bottom: -10%;
    left: -1.5%;
    width: 430px;
    height: auto;
    opacity: 0.88;
    display: block;
    transform: rotate(-5deg);
    filter: drop-shadow(0 12px 32px rgba(0, 0, 0, 0.9)) drop-shadow(0 4px 10px rgba(0, 0, 0, 0.7));
    z-index: 2;
}


.prop-chase-cards {
    position: absolute;
    bottom: 3%;
    left: 23.3%;
    width: 280px;
    height: auto;
    opacity: 0.88;
    display: block;
    transform: rotate(5deg);
    filter: drop-shadow(0 12px 32px rgba(0, 0, 0, 0.9)) drop-shadow(0 4px 10px rgba(0, 0, 0, 0.7));
    z-index: 1;
}


.prop-chase-logo {
    position: absolute;
    top: 7%;
    left: 46%;
    width: 160px;
    height: auto;
    opacity: 0.54;
    display: block;
    transform: rotate(2deg);
    filter: grayscale(1) invert(1);
}


.prop-discover-logo {
    position: absolute;
    top: 8%;
    right: 6%;
    width: 140px;
    height: auto;
    opacity: 0.60;
    display: block;
    transform: rotate(5deg);
    filter: grayscale(1) invert(1);
}


.prop-citi-logo {
    position: absolute;
    top: 4%;
    left: 40%;
    width: 100px;
    height: auto;
    opacity: 0.48;
    display: block;
    transform: translateX(-50%) rotate(-13deg);
    filter: brightness(1.6);
}


.prop-newspaper {
    position: absolute;
    top: 2.7%;
    left: 2%;
    width: 540px;
    height: auto;
    opacity: 0.65;
    display: block;
    transform: rotate(-6deg);
    filter: brightness(0.75) contrast(1.05);
    border-radius: 2px;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.85), 0 4px 12px rgba(0, 0, 0, 0.6);
}


.prop-amex-logo {
    position: absolute;
    top: 3%;
    right: 35%;
    width: 85px;
    height: auto;
    opacity: 0.62;
    display: block;
    transform: rotate(11deg);
    filter: brightness(1.5) opacity(0.55);
}


.prop-amex-black-card {
    position: absolute;
    top: 21%;
    right: 1.3%;
    width: 270px;
    height: auto;
    border-radius: 14px;
    box-shadow:
        0 12px 36px rgba(0, 0, 0, 0.5),
        0 0 20px rgba(120, 100, 50, 0.12);
    opacity: 0.88;
    display: block;
    transform: rotate(-10deg);
}


.prop-poster {
    position: absolute;
    bottom: 4px;
    right: 1%;
    width: 620px;
    height: auto;
    opacity: 0.75;
    display: block;
    transform: rotate(2deg);
    transform-origin: bottom right;
    z-index: 2;
    filter: drop-shadow(0 16px 48px rgba(0, 0, 0, 0.95)) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.75));
}


.prop-gucci {
    position: absolute;
    bottom: 14%;
    left: 21%;
    width: 300px;
    height: auto;
    opacity: 0.82;
    display: block;
    transform: rotate(4deg);
    filter: drop-shadow(0 12px 32px rgba(0, 0, 0, 0.9)) drop-shadow(0 4px 10px rgba(0, 0, 0, 0.7));
    z-index: 0;
}


.prop-bofa-logo {
    position: absolute;
    bottom: 5%;
    left: 50%;
    width: 185px;
    height: auto;
    display: block;
    transform: translateX(-50%) rotate(-3deg);
    filter: invert(1) brightness(1.8) opacity(0.55) drop-shadow(0 4px 16px rgba(0, 0, 0, 0.6));
}



.theme-form {
    position: fixed;
    top: 18px;
    right: 20px;
    z-index: 200;
    margin: 0;
    padding: 0;
}

.theme-toggle-label {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(255, 255, 255, 0.15);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    padding: 0;
    font-size: 0;
}

.theme-toggle-label::before {
    content: "☀";
    font-size: 20px;
    color: #fff;
    line-height: 1;
}

.theme-toggle-label:hover {
    background: rgba(0, 0, 0, 0.50);
    border-color: rgba(255, 255, 255, 0.25);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
}

.theme-toggle-label:active {
    transform: scale(0.95);
}


body.light-mode {
    background-color: #eeeee8;
    color: #1a1a1a;
}

body.light-mode .bg-orb--green {
    background: radial-gradient(circle, rgba(0, 140, 70, 0.07), transparent 70%);
}

body.light-mode .bg-orb--blue {
    background: radial-gradient(circle, rgba(10, 100, 200, 0.05), transparent 70%);
}



body.light-mode .auth-card {
    background: linear-gradient(160deg, #fafaf7 0%, #f4f4ef 100%);
    border-color: rgba(0, 0, 0, 0.10);
    border-top: none;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 40px 100px rgba(0, 0, 0, 0.14),
        0 10px 30px rgba(0, 0, 0, 0.09),
        0 0 0 1px rgba(0, 0, 0, 0.05);
}

body.light-mode .auth-logo {
    border-bottom-color: rgba(0, 0, 0, 0.07);
}

body.light-mode .auth-logo-img {
    mix-blend-mode: multiply;
    opacity: 1;
}

body.light-mode .auth-tagline {
    color: rgba(160, 110, 20, 0.7);
}

body.light-mode .alert-danger,
body.light-mode .alert-error {
    background: rgba(200, 50, 50, 0.07);
    border-color: rgba(180, 50, 50, 0.25);
    color: #a03030;
}

body.light-mode .alert-success {
    background: rgba(0, 160, 70, 0.07);
    border-color: rgba(0, 140, 60, 0.25);
    color: #1a7a40;
}

body.light-mode .alert-warning {
    background: rgba(180, 130, 0, 0.07);
    border-color: rgba(160, 110, 0, 0.25);
    color: #8a6000;
}

body.light-mode .alert-info {
    background: rgba(10, 120, 220, 0.07);
    border-color: rgba(10, 100, 200, 0.25);
    color: #1a5aaa;
}

body.light-mode .form__label {
    color: #1a7a40;
}

body.light-mode .form__label-optional {
    color: rgba(0, 120, 50, 0.55);
}

body.light-mode .form__input,
body.light-mode #id_captcha_1,
body.light-mode .captcha input[type="text"] {
    background-color: #fff;
    border-color: rgba(0, 0, 0, 0.12);
    border-left-color: rgba(0, 160, 60, 0.25);
    color: #111;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
}

body.light-mode .form__input::placeholder,
body.light-mode #id_captcha_1::placeholder,
body.light-mode .captcha input[type="text"]::placeholder {
    color: #c0c0b8;
    font-style: italic;
}

body.light-mode .form__input:focus,
body.light-mode #id_captcha_1:focus,
body.light-mode .captcha input[type="text"]:focus {
    border-color: rgba(0, 0, 0, 0.12);
    border-left-color: rgba(0, 160, 60, 0.7);
    color: #080808;
    box-shadow: -3px 0 10px rgba(0, 140, 60, 0.08), inset 0 1px 3px rgba(0, 0, 0, 0.04);
    background-color: #fff;
}

body.light-mode .form__input.error {
    border-left-color: rgba(180, 40, 40, 0.7);
    border-color: rgba(180, 40, 40, 0.25);
}

body.light-mode .totp-input {
    color: #0a7a3d;
}

body.light-mode .totp-input::placeholder {
    color: #c0c0b8;
}

body.light-mode .totp-input:focus {
    color: #065c2e;
    border-left-color: rgba(0, 160, 60, 0.8);
}

body.light-mode .captcha-img {
    border-color: rgba(0, 0, 0, 0.10);
    background: #f8f8f4;
}

body.light-mode .form__checkbox-label {
    color: #666;
}

body.light-mode .form__checkbox-label input[type="checkbox"] {
    accent-color: #1a7a40;
    background: #fff;
    border-color: rgba(0, 0, 0, 0.15);
}

body.light-mode .form__checkbox-label a {
    color: #1a7a40;
}

body.light-mode .form__checkbox-label a:hover {
    color: #0d5c2e;
}

body.light-mode .form__button--primary {
    background: linear-gradient(135deg, #0c8a4e 0%, #065e36 100%);
    color: #d0ffd8;
    box-shadow: 0 4px 16px rgba(0, 140, 70, 0.28);
    border-color: rgba(0, 180, 80, 0.15);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

body.light-mode .form__button--primary:hover {
    background: linear-gradient(135deg, #0fa85e 0%, #087844 100%);
    color: #fff;
    box-shadow: 0 6px 22px rgba(0, 160, 80, 0.38);
}

body.light-mode .form__button--secondary {
    color: #888;
    border-color: rgba(0, 0, 0, 0.14);
    background: rgba(0, 0, 0, 0.02);
}

body.light-mode .form__button--secondary:hover {
    border-color: rgba(0, 0, 0, 0.22);
    color: #555;
    background: rgba(0, 0, 0, 0.05);
}

body.light-mode .auth-footer-link {
    color: #555;
}

body.light-mode .auth-footer-link a {
    color: #1a7a40;
}

body.light-mode .auth-footer-link a:hover {
    color: #0d5c2e;
}

body.light-mode .form-footer {
    color: #666;
}

body.light-mode .auth-divider {
    color: #ddd;
}

body.light-mode .auth-divider::before,
body.light-mode .auth-divider::after {
    background: #e8e8e8;
}

body.light-mode .prop-newspaper {
    filter: brightness(0.7) contrast(1.1) saturate(0.9);
    opacity: 0.85;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45), 0 4px 14px rgba(0, 0, 0, 0.3);
}

body.light-mode .prop-amex-logo {
    filter: none;
    opacity: 0.95;
}

body.light-mode .prop-chase-logo {
    opacity: 0.95;
    filter: none;
}

body.light-mode .prop-discover-logo {
    opacity: 0.95;
    filter: none;
}

body.light-mode .prop-discover-logo {
    opacity: 0.95;
}

body.light-mode .prop-citi-logo {
    filter: none;
    opacity: 0.95;
}

body.light-mode .prop-bofa-logo {
    filter: brightness(0.8) contrast(1.1) opacity(0.65) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.2));
}

body.light-mode .prop-amex-black-card {
    opacity: 0.92;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15));
}

body.light-mode .prop-poster {
    opacity: 0.90;
    filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.35)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.25)) sepia(0.15) contrast(1.08);
}

body.light-mode .prop-multiple-cards {
    opacity: 0.92;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15)) contrast(1.05);
}

body.light-mode .prop-chase-sapphire {
    opacity: 0.92;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15)) contrast(1.05);
}

body.light-mode .prop-chase-cards {
    opacity: 0.92;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15)) contrast(1.05);
}

body.light-mode .prop-gucci {
    opacity: 0.82;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15)) contrast(1.05) saturate(1.1);
}

body.light-mode .theme-toggle-label {
    background: rgba(255, 255, 255, 0.35);
    border-color: rgba(0, 0, 0, 0.15);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

body.light-mode .theme-toggle-label::before {
    content: "☽";
    color: #333;
}

body.light-mode .theme-toggle-label:hover {
    background: rgba(255, 255, 255, 0.50);
    border-color: rgba(0, 0, 0, 0.25);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}



body:has(#theme-toggle:checked) {
    background-color: #eeeee8;
    color: #1a1a1a;
}

body:has(#theme-toggle:checked) .bg-orb--green {
    background: radial-gradient(circle, rgba(0, 140, 70, 0.07), transparent 70%);
}

body:has(#theme-toggle:checked) .bg-orb--blue {
    background: radial-gradient(circle, rgba(10, 100, 200, 0.05), transparent 70%);
}



body:has(#theme-toggle:checked) .auth-card {
    background: linear-gradient(160deg, #fafaf7 0%, #f4f4ef 100%);
    border-color: rgba(0, 0, 0, 0.10);
    border-top: none;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 40px 100px rgba(0, 0, 0, 0.14),
        0 10px 30px rgba(0, 0, 0, 0.09),
        0 0 0 1px rgba(0, 0, 0, 0.05);
}

body:has(#theme-toggle:checked) .auth-logo {
    border-bottom-color: rgba(0, 0, 0, 0.07);
}

body:has(#theme-toggle:checked) .auth-logo-img {
    mix-blend-mode: multiply;
    opacity: 1;
}

body:has(#theme-toggle:checked) .auth-tagline {
    color: rgba(0, 140, 50, 0.6);
}

body:has(#theme-toggle:checked) .form__label {
    color: #1a7a40;
}

body:has(#theme-toggle:checked) .form__label-optional {
    color: rgba(0, 120, 50, 0.55);
}

body:has(#theme-toggle:checked) .alert-danger,
body:has(#theme-toggle:checked) .alert-error {
    background: rgba(200, 50, 50, 0.07);
    border-color: rgba(180, 50, 50, 0.25);
    color: #a03030;
}

body:has(#theme-toggle:checked) .alert-success {
    background: rgba(0, 160, 70, 0.07);
    border-color: rgba(0, 140, 60, 0.25);
    color: #1a7a40;
}

body:has(#theme-toggle:checked) .alert-warning {
    background: rgba(180, 130, 0, 0.07);
    border-color: rgba(160, 110, 0, 0.25);
    color: #8a6000;
}

body:has(#theme-toggle:checked) .alert-info {
    background: rgba(10, 120, 220, 0.07);
    border-color: rgba(10, 100, 200, 0.25);
    color: #1a5aaa;
}

body:has(#theme-toggle:checked) .form__input,
body:has(#theme-toggle:checked) #id_captcha_1,
body:has(#theme-toggle:checked) .captcha input[type="text"] {
    background-color: #fff;
    border-color: rgba(0, 0, 0, 0.16);
    color: #1a1a1a;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
}

body:has(#theme-toggle:checked) .form__input::placeholder,
body:has(#theme-toggle:checked) #id_captcha_1::placeholder,
body:has(#theme-toggle:checked) .captcha input[type="text"]::placeholder {
    color: #bbb;
}

body:has(#theme-toggle:checked) .form__input:focus,
body:has(#theme-toggle:checked) #id_captcha_1:focus,
body:has(#theme-toggle:checked) .captcha input[type="text"]:focus {
    border-color: rgba(0, 0, 0, 0.12);
    border-left-color: rgba(0, 160, 60, 0.7);
    color: #080808;
    box-shadow: -3px 0 10px rgba(0, 140, 60, 0.08), inset 0 1px 3px rgba(0, 0, 0, 0.04);
}

body:has(#theme-toggle:checked) .form__input.error {
    border-left-color: rgba(180, 40, 40, 0.7);
    border-color: rgba(180, 40, 40, 0.25);
}

body:has(#theme-toggle:checked) .captcha-img {
    border-color: rgba(0, 0, 0, 0.10);
    background: #f8f8f4;
}

body:has(#theme-toggle:checked) .form__checkbox-label {
    color: #888;
}

body:has(#theme-toggle:checked) .form__checkbox-label input[type="checkbox"] {
    accent-color: #1a7a40;
}

body:has(#theme-toggle:checked) .form__checkbox-label a {
    color: #1a7a40;
}

body:has(#theme-toggle:checked) .form__checkbox-label a:hover {
    color: #0d5c2e;
}

body:has(#theme-toggle:checked) .form__button--primary {
    background: linear-gradient(135deg, #0c8a4e 0%, #065e36 100%);
    color: #d0ffd8;
    box-shadow: 0 4px 16px rgba(0, 140, 70, 0.28);
}

body:has(#theme-toggle:checked) .form__button--primary:hover {
    background: linear-gradient(135deg, #0fa85e 0%, #087844 100%);
    color: #fff;
    box-shadow: 0 6px 22px rgba(0, 160, 80, 0.38);
}

body:has(#theme-toggle:checked) .form__button--secondary {
    color: #888;
    border-color: rgba(0, 0, 0, 0.14);
    background: rgba(0, 0, 0, 0.02);
}

body:has(#theme-toggle:checked) .form__button--secondary:hover {
    border-color: rgba(0, 0, 0, 0.22);
    color: #555;
    background: rgba(0, 0, 0, 0.05);
}

body:has(#theme-toggle:checked) .auth-footer-link {
    color: #555;
}

body:has(#theme-toggle:checked) .auth-footer-link a {
    color: #1a7a40;
}

body:has(#theme-toggle:checked) .auth-footer-link a:hover {
    color: #0d5c2e;
}

body:has(#theme-toggle:checked) .form-footer {
    color: #666;
}

body:has(#theme-toggle:checked) .auth-divider {
    color: #ddd;
}

body:has(#theme-toggle:checked) .auth-divider::before,
body:has(#theme-toggle:checked) .auth-divider::after {
    background: #e8e8e8;
}

body:has(#theme-toggle:checked) a {
    color: #1a7a40;
}

body:has(#theme-toggle:checked) a:hover {
    color: #0d5c2e;
}

body:has(#theme-toggle:checked) .prop-newspaper {
    filter: brightness(0.7) contrast(1.1) saturate(0.9);
    opacity: 0.85;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45), 0 4px 14px rgba(0, 0, 0, 0.3);
}

body:has(#theme-toggle:checked) .prop-amex-logo {
    filter: none;
    opacity: 0.95;
}

body:has(#theme-toggle:checked) .prop-chase-logo {
    opacity: 0.95;
    filter: none;
}

body:has(#theme-toggle:checked) .prop-discover-logo {
    opacity: 0.95;
    filter: none;
}

body:has(#theme-toggle:checked) .prop-citi-logo {
    filter: none;
    opacity: 0.95;
}

body:has(#theme-toggle:checked) .prop-bofa-logo {
    filter: brightness(0.8) contrast(1.1) opacity(0.65) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.2));
}

body:has(#theme-toggle:checked) .prop-amex-black-card {
    opacity: 0.92;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15));
}

body:has(#theme-toggle:checked) .prop-poster {
    opacity: 0.90;
    filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.35)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.25)) sepia(0.15) contrast(1.08);
}

body:has(#theme-toggle:checked) .prop-multiple-cards {
    opacity: 0.70;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15)) contrast(1.05);
}

body:has(#theme-toggle:checked) .prop-chase-sapphire {
    opacity: 0.92;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15)) contrast(1.05);
}

body:has(#theme-toggle:checked) .prop-chase-cards {
    opacity: 0.92;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15)) contrast(1.05);
}

body:has(#theme-toggle:checked) .prop-gucci {
    opacity: 0.82;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15)) contrast(1.05) saturate(1.1);
}

body:has(#theme-toggle:checked) .theme-toggle-label {
    background: rgba(0, 0, 0, 0.05);
    border-color: rgba(0, 0, 0, 0.10);
}

body:has(#theme-toggle:checked) .theme-toggle-label::before {
    content: "☽";
    color: rgba(0, 0, 0, 0.35);
}

body:has(#theme-toggle:checked) .theme-toggle-label:hover {
    background: rgba(0, 0, 0, 0.09);
    border-color: rgba(0, 0, 0, 0.18);
}


@media (prefers-color-scheme: light) {
    body:has(#theme-toggle:checked) {
        background-color: #080808;
        color: #ccc;
    }

    body:has(#theme-toggle:checked) .bg-orb--green {
        background: radial-gradient(circle, rgba(0, 160, 80, 0.045), transparent 70%);
    }

    body:has(#theme-toggle:checked) .bg-orb--blue {
        background: radial-gradient(circle, rgba(10, 120, 220, 0.035), transparent 70%);
    }



    body:has(#theme-toggle:checked) .auth-card {
        background: rgba(9, 9, 9, 0.94);
        border-color: rgba(255, 255, 255, 0.07);
        border-top-color: rgba(255, 255, 255, 0.11);
        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05) inset, 0 50px 120px rgba(0, 0, 0, 0.75), 0 16px 40px rgba(0, 0, 0, 0.5);
    }

    body:has(#theme-toggle:checked) .auth-logo-img {
        mix-blend-mode: screen;
    }

    body:has(#theme-toggle:checked) .auth-tagline {
        color: #777;
    }

    body:has(#theme-toggle:checked) .form__label {
        color: #3c3c3c;
    }

    body:has(#theme-toggle:checked) .form__label-optional {
        color: #444;
    }

    body:has(#theme-toggle:checked) .alert-danger,
    body:has(#theme-toggle:checked) .alert-error {
        background: rgba(200, 50, 50, 0.1);
        border-color: rgba(180, 50, 50, 0.4);
        color: #e8a0a0;
    }

    body:has(#theme-toggle:checked) .alert-success {
        background: rgba(0, 200, 80, 0.08);
        border-color: rgba(0, 200, 80, 0.3);
        color: #80d8a0;
    }

    body:has(#theme-toggle:checked) .alert-warning {
        background: rgba(200, 160, 0, 0.08);
        border-color: rgba(200, 160, 0, 0.3);
        color: #d4b060;
    }

    body:has(#theme-toggle:checked) .alert-info {
        background: rgba(10, 170, 255, 0.08);
        border-color: rgba(10, 170, 255, 0.3);
        color: #80c0e8;
    }

    body:has(#theme-toggle:checked) .form__input,
    body:has(#theme-toggle:checked) #id_captcha_1,
    body:has(#theme-toggle:checked) .captcha input[type="text"] {
        background-color: #050505;
        border-color: rgba(255, 255, 255, 0.06);
        color: #b8b8b8;
    }

    body:has(#theme-toggle:checked) .form__input::placeholder,
    body:has(#theme-toggle:checked) #id_captcha_1::placeholder,
    body:has(#theme-toggle:checked) .captcha input[type="text"]::placeholder {
        color: #262626;
    }

    body:has(#theme-toggle:checked) .form__input:focus,
    body:has(#theme-toggle:checked) #id_captcha_1:focus,
    body:has(#theme-toggle:checked) .captcha input[type="text"]:focus {
        border-color: rgba(0, 160, 80, 0.45);
        color: #d8d8d8;
    }

    body:has(#theme-toggle:checked) .captcha-img {
        border-color: #252525;
        background: #111;
    }

    body:has(#theme-toggle:checked) .form__checkbox-label {
        color: #666;
    }

    body:has(#theme-toggle:checked) .form__checkbox-label a {
        color: #3a8a5c;
    }

    body:has(#theme-toggle:checked) .form__checkbox-label a:hover {
        color: #5aaa78;
    }

    body:has(#theme-toggle:checked) .form__button--primary {
        background: linear-gradient(135deg, #0a7a45 0%, #055c34 100%);
        color: #e8ffe8;
        box-shadow: 0 2px 10px rgba(0, 140, 70, 0.3);
    }

    body:has(#theme-toggle:checked) .form__button--primary:hover {
        background: linear-gradient(135deg, #0d9454 0%, #077040 100%);
        color: #fff;
    }

    body:has(#theme-toggle:checked) .form__button--secondary {
        color: #484848;
        border-color: rgba(255, 255, 255, 0.12);
        background: rgba(255, 255, 255, 0.03);
    }

    body:has(#theme-toggle:checked) .form__button--secondary:hover {
        border-color: rgba(255, 255, 255, 0.20);
        color: #666;
        background: rgba(255, 255, 255, 0.06);
    }

    body:has(#theme-toggle:checked) .auth-footer-link a {
        color: #3a8a5c;
    }

    body:has(#theme-toggle:checked) .auth-footer-link a:hover {
        color: #5aaa78;
    }

    body:has(#theme-toggle:checked) .form-footer {
        color: #3a3a3a;
    }

    body:has(#theme-toggle:checked) .auth-divider {
        color: #2a2a2a;
    }

    body:has(#theme-toggle:checked) .auth-divider::before,
    body:has(#theme-toggle:checked) .auth-divider::after {
        background: #1e1e1e;
    }

    body:has(#theme-toggle:checked) a {
        color: #3a8a5c;
    }

    body:has(#theme-toggle:checked) a:hover {
        color: #5aaa78;
    }

    body:has(#theme-toggle:checked) .prop-newspaper {
        filter: brightness(0.75) contrast(1.05);
        opacity: 0.65;
        box-shadow: 0 16px 48px rgba(0, 0, 0, 0.85), 0 4px 12px rgba(0, 0, 0, 0.6);
    }

    body:has(#theme-toggle:checked) .prop-amex-logo {
        filter: brightness(1.2);
        opacity: 0.62;
    }

    body:has(#theme-toggle:checked) .prop-chase-logo {
        filter: grayscale(1) invert(1);
        opacity: 0.54;
    }

    body:has(#theme-toggle:checked) .prop-citi-logo {
        filter: invert(1) brightness(1.6) opacity(0.6);
        opacity: 0.48;
    }

    body:has(#theme-toggle:checked) .prop-bofa-logo {
        filter: brightness(0.8) contrast(1.1) opacity(0.65) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.2));
    }

    body:has(#theme-toggle:checked) .prop-amex-black-card {
        opacity: 0.88;
        filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15));
    }

    body:has(#theme-toggle:checked) .prop-poster {
        opacity: 0.90;
    }

    body:has(#theme-toggle:checked) .prop-multiple-cards {
        opacity: 0.88;
        filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15)) contrast(1.05);
    }

    body:has(#theme-toggle:checked) .prop-chase-sapphire {
        opacity: 0.88;
        filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15)) contrast(1.05);
    }

    body:has(#theme-toggle:checked) .prop-chase-cards {
        opacity: 0.88;
        filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15)) contrast(1.05);
    }

    body:has(#theme-toggle:checked) .prop-gucci {
        opacity: 0.82;
        filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.15)) contrast(1.05) saturate(1.1);
    }

    body:has(#theme-toggle:checked) .theme-toggle-label {
        background: rgba(0, 0, 0, 0.35);
        border-color: rgba(255, 255, 255, 0.15);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    }

    body:has(#theme-toggle:checked) .theme-toggle-label::before {
        content: "☀";
        color: #fff;
    }

    body:has(#theme-toggle:checked) .theme-toggle-label:hover {
        background: rgba(0, 0, 0, 0.50);
        border-color: rgba(255, 255, 255, 0.25);
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
    }
}


.lang-switcher-auth {
    position: fixed;
    top: 18px;
    right: 74px;
    z-index: 200;
}

.lang-toggle-check {
    display: none;
}

.lang-trigger-auth {
    width: auto;
    min-width: 44px;
    height: 44px;
    padding: 0 10px;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(255, 255, 255, 0.15);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    font-size: 11px;
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.75);
    letter-spacing: 0.05em;
    white-space: nowrap;
    gap: 4px;
}

.lang-trigger-auth:hover {
    background: rgba(0, 0, 0, 0.50);
    border-color: rgba(255, 255, 255, 0.30);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
}

.lang-dropdown-auth {
    list-style: none;
    margin: 6px 0 0 0;
    padding: 4px 0;
    position: absolute;
    top: 100%;
    right: 0;
    min-width: 130px;
    background: rgba(15, 15, 15, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity 0.15s ease, visibility 0.15s ease, transform 0.15s ease;
}

.lang-toggle-check:checked~.lang-dropdown-auth,
.lang-switcher-auth:hover .lang-dropdown-auth {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.lang-dropdown-auth li {
    margin: 0;
}

.lang-option-auth {
    display: block;
    width: 100%;
    background: none;
    border: none;
    padding: 8px 14px;
    font-size: 13px;
    font-family: 'IBM Plex Sans', sans-serif;
    color: rgba(255, 255, 255, 0.7);
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
}

.lang-option-auth:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
}

.lang-option-auth--active {
    color: #fff;
    font-weight: 600;
}

body.light-mode .lang-trigger-auth {
    background: rgba(255, 255, 255, 0.55);
    border-color: rgba(0, 0, 0, 0.15);
    color: rgba(0, 0, 0, 0.7);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

body.light-mode .lang-trigger-auth:hover {
    background: rgba(255, 255, 255, 0.75);
    border-color: rgba(0, 0, 0, 0.25);
}

body.light-mode .lang-dropdown-auth {
    background: rgba(245, 245, 240, 0.97);
    border-color: rgba(0, 0, 0, 0.12);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

body.light-mode .lang-option-auth {
    color: rgba(0, 0, 0, 0.65);
}

body.light-mode .lang-option-auth:hover {
    background: rgba(0, 0, 0, 0.05);
    color: #1a1a1a;
}

body.light-mode .lang-option-auth--active {
    color: #1a1a1a;
}

.onion-banner-login {
    background: rgba(255, 165, 0, 0.08);
    border: 1px solid rgba(255, 165, 0, 0.35);
    border-left: 3px solid #ffa500;
    color: #ffa500;
    font-size: 11px;
    padding: 8px 12px;
    border-radius: 4px;
    margin-bottom: 16px;
    line-height: 1.5;
}

.onion-banner-login-link {
    color: #ffd080;
    text-decoration: underline;
}

.onion-banner-login-link:hover {
    color: #ffffff;
}

body.light-mode .onion-banner-login {
    background: rgba(180, 100, 0, 0.06);
    border-color: rgba(180, 100, 0, 0.4);
    border-left-color: #b46400;
    color: #7a4400;
}

body.light-mode .onion-banner-login-link {
    color: #7a4400;
}


.auth-official-domains {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px 10px;
    padding: 16px 40px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    margin-top: 20px;
    flex-wrap: wrap;
}

.auth-official-domains__label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: rgba(0, 200, 80, 0.45);
    white-space: nowrap;
    flex-basis: 100%;
    text-align: center;
}

.auth-official-domains__link {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    color: rgba(255, 255, 255, 0.30);
    text-decoration: none;
    letter-spacing: 0.02em;
}

.auth-official-domains__link:hover {
    color: rgba(0, 220, 90, 0.75);
    text-decoration: none;
}

.auth-official-domains__link--onion {
    flex-basis: 100%;
    text-align: center;
    word-break: break-all;
}

body.light-mode .auth-official-domains {
    border-top-color: rgba(0, 0, 0, 0.07);
}

body.light-mode .auth-official-domains__label {
    color: rgba(0, 140, 50, 0.45);
}

body.light-mode .auth-official-domains__link {
    color: rgba(0, 0, 0, 0.30);
}

.auth-official-domains__sep {
    color: rgba(255, 255, 255, 0.12);
    font-size: 12px;
}

body.light-mode .auth-official-domains__sep {
    color: rgba(0, 0, 0, 0.15);
}

body.light-mode .auth-official-domains__link:hover {
    color: rgba(0, 140, 50, 0.75);
}



@media (max-width: 374px) {
    .auth-section {
        padding: 24px 8px;
    }

    .auth-card-inner {
        padding: 24px 16px 0;
    }

    .auth-official-domains {
        padding: 12px 16px 0;
        gap: 4px 6px;
    }

    .auth-official-domains__label {
        font-size: 8px;
    }

    .auth-official-domains__link {
        font-size: 10px;
    }

    .auth-logo-img {
        max-width: 160px;
    }

    .auth-tagline {
        font-size: 11px;
    }

    .form__label {
        font-size: 9px;
    }

    .form__input,
    #id_captcha_1,
    .captcha input[type="text"] {
        height: 42px;
        padding: 10px 12px;
        font-size: 13px;
    }

    .totp-input {
        height: 42px;
        font-size: 13px;
    }

    .form__button {
        height: 44px;
        line-height: 44px;
        font-size: 9px;
    }

    .form-footer {
        font-size: 9px;
    }

    .form__hint {
        font-size: 10px;
    }

    .theme-form {
        top: 10px;
        right: 10px;
    }

    .lang-switcher-auth {
        top: 10px;
        right: 58px;
    }

    .theme-toggle-label {
        width: 38px;
        height: 38px;
        border-radius: 8px;
    }

    .lang-trigger-auth {
        width: 38px;
        height: 38px;
        min-width: 38px;
        border-radius: 8px;
        font-size: 10px;
        padding: 0 8px;
    }

    .onion-banner-login {
        font-size: 10px;
        padding: 6px 10px;
    }
}

@media (min-width: 481px) and (max-width: 959px) {
    .auth-card-inner {
        padding: 32px 36px 0;
    }

    .auth-official-domains {
        padding: 16px 36px 0;
    }
}

@media (min-width: 1920px) {
    .prop-multiple-cards {
        width: clamp(330px, 19.1vw, 495px);
    }

    .prop-chase-sapphire {
        width: clamp(430px, 24.9vw, 645px);
    }

    .prop-chase-cards {
        width: clamp(280px, 16.2vw, 420px);
    }

    .prop-chase-logo {
        width: clamp(160px, 9.3vw, 240px);
    }

    .prop-discover-logo {
        width: clamp(140px, 8.1vw, 210px);
    }

    .prop-citi-logo {
        width: clamp(100px, 5.8vw, 150px);
    }

    .prop-newspaper {
        width: clamp(540px, 31.25vw, 810px);
    }

    .prop-amex-logo {
        width: clamp(85px, 4.9vw, 128px);
    }

    .prop-amex-black-card {
        width: clamp(270px, 15.6vw, 405px);
    }

    .prop-poster {
        width: clamp(620px, 35.9vw, 930px);
    }

    .prop-gucci {
        width: clamp(300px, 17.4vw, 450px);
    }

    .prop-bofa-logo {
        width: clamp(185px, 10.7vw, 278px);
    }

    .bg-orb--green {
        width: 900px;
        height: 900px;
    }

    .bg-orb--blue {
        width: 780px;
        height: 780px;
    }
}

@media (min-width: 2560px) {
    .prop-multiple-cards {
        width: clamp(495px, 19.1vw, 660px);
    }

    .prop-chase-sapphire {
        width: clamp(645px, 24.9vw, 860px);
    }

    .prop-chase-cards {
        width: clamp(420px, 16.2vw, 560px);
    }

    .prop-chase-logo {
        width: clamp(240px, 9.3vw, 320px);
    }

    .prop-discover-logo {
        width: clamp(210px, 8.1vw, 280px);
    }

    .prop-citi-logo {
        width: clamp(150px, 5.8vw, 200px);
    }

    .prop-newspaper {
        width: clamp(810px, 31.25vw, 1080px);
    }

    .prop-amex-logo {
        width: clamp(128px, 4.9vw, 170px);
    }

    .prop-amex-black-card {
        width: clamp(405px, 15.6vw, 540px);
    }

    .prop-poster {
        width: clamp(930px, 35.9vw, 1240px);
    }

    .prop-gucci {
        width: clamp(450px, 17.4vw, 600px);
    }

    .prop-bofa-logo {
        width: clamp(278px, 10.7vw, 370px);
    }

    .bg-orb--green {
        width: 1100px;
        height: 1100px;
    }

    .bg-orb--blue {
        width: 950px;
        height: 950px;
    }
}


.page-register .prop-citi-logo {
    top: 2%;
    left: 40%;
}

.page-register .prop-chase-logo {
    top: 4%;
    left: 46%;
}

.page-register .prop-amex-logo {
    top: 1%;
    right: 35%;
}

.page-register .prop-bofa-logo {
    bottom: 4%;
    left: 50%;
}
