* {
    box-sizing: border-box;
}

body {
    min-height: 100vh;
    margin: 0;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    font-weight: 400;
    color: #17202a;
    background: #f1f5f9;
}

a {
    color: inherit;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 40;
    border-bottom: 1px solid #e5edf7;
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(16px);
}

.site-header-inner {
    width: min(1400px, calc(100% - 48px));
    min-height: 92px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 28px;
}

.site-header-brand {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    text-decoration: none;
}

.site-header-brand img {
    width: 190px;
    max-height: 58px;
    object-fit: contain;
    display: block;
}

.site-header-nav {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(14px, 1.8vw, 28px);
    overflow-x: auto;
    scrollbar-width: none;
}

.site-header-nav::-webkit-scrollbar {
    display: none;
}

.site-header-nav a,
.site-header-action {
    color: #111827;
    text-decoration: none;
    font-size: 17px;
    line-height: 1.2;
    white-space: nowrap;
}

.site-header-nav a:hover,
.site-header-action:hover {
    color: #1f5eff;
}

.site-header-action {
    min-height: 42px;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    color: #fff;
    background: #1f5eff;
    font-weight: 800;
}

.site-header-action:hover {
    color: #fff;
    background: #0f172a;
}

.soon-page {
    color: #fff;
    background:
        linear-gradient(120deg, rgba(11, 18, 32, .86), rgba(185, 35, 64, .74)),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='800' viewBox='0 0 1200 800'%3E%3Crect width='1200' height='800' fill='%23d9e4ee'/%3E%3Cg opacity='.32' fill='%2323344d'%3E%3Crect x='80' y='92' width='430' height='265' rx='20'/%3E%3Crect x='130' y='420' width='300' height='42' rx='8'/%3E%3Crect x='470' y='415' width='580' height='56' rx='12'/%3E%3Ccircle cx='910' cy='185' r='94'/%3E%3C/g%3E%3Cg opacity='.22' stroke='%23ffffff' stroke-width='2'%3E%3Cpath d='M0 640 C240 560 370 750 610 650 S1000 500 1200 610'/%3E%3Cpath d='M0 710 C240 640 390 780 650 705 S990 620 1200 720'/%3E%3C/g%3E%3C/svg%3E");
    background-size: cover;
    background-position: center;
}

.soon-shell {
    width: min(1120px, calc(100% - 32px));
    min-height: 100vh;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
}

.soon-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 24px 0;
}

.soon-brand,
.login-link,
.primary-link {
    text-decoration: none;
    font-weight: 650;
}

.soon-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 19px;
}

.logo-mark {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 8px;
    color: #fff;
    background: #082b50;
    border: 3px solid #ff557a;
    font-size: 14px;
    font-weight: 700;
}

.logo-mark img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.soon-brand .logo-image {
    width: 190px;
    height: 52px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.legal-nav .soon-brand {
    min-width: 190px;
}

.login-link {
    padding: 10px 18px;
    border: 1px solid rgba(255, 255, 255, .42);
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
}

.soon-hero {
    width: min(760px, 100%);
    margin: auto 0;
    padding: 72px 0;
}

.soon-kicker {
    margin: 0 0 14px;
    font-weight: 650;
    color: #ffd7df;
    text-transform: uppercase;
}

.soon-hero h1 {
    margin: 0;
    font-size: clamp(44px, 7vw, 86px);
    line-height: 1;
    letter-spacing: 0;
}

.soon-copy {
    width: min(630px, 100%);
    margin: 22px 0 0;
    color: rgba(255, 255, 255, .82);
    font-size: 18px;
    line-height: 1.7;
}

.soon-actions {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-top: 34px;
    color: rgba(255, 255, 255, .68);
    font-weight: 500;
}

.primary-link {
    padding: 13px 22px;
    border-radius: 999px;
    color: #111827;
    background: #fff;
}

.secondary-link {
    padding: 13px 20px;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 999px;
    color: #fff;
    background: rgba(255, 255, 255, .12);
    text-decoration: none;
    font-weight: 650;
}

.soon-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    padding-bottom: 28px;
}

.soon-strip article {
    min-height: 96px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 8px;
    background: rgba(255, 255, 255, .1);
    backdrop-filter: blur(12px);
}

.soon-strip strong,
.soon-strip span {
    display: block;
}

.soon-strip span {
    margin-top: 8px;
    color: rgba(255, 255, 255, .72);
}

.auth-page {
    display: grid;
    place-items: center;
    padding: 18px;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(255, 85, 122, .13), transparent 28%),
        radial-gradient(circle at 82% 22%, rgba(58, 108, 214, .22), transparent 18rem),
        radial-gradient(circle at 16% 80%, rgba(18, 184, 134, .12), transparent 16rem),
        linear-gradient(155deg, #0d1423, #1a2432 55%, #111827);
    overflow-x: hidden;
}

.auth-page::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .55), transparent 82%);
}

.auth-shell {
    width: min(350px, 100%);
}

.auth-card {
    position: relative;
    padding: 22px 20px 20px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(18, 27, 43, .93), rgba(15, 23, 42, .88));
    box-shadow: 0 30px 80px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .06);
    backdrop-filter: blur(18px);
}

.auth-card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(135deg, rgba(255, 255, 255, .1), transparent 34%, rgba(255, 85, 122, .08));
}

.recovery-shell {
    width: min(980px, 100%);
}

.recovery-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(360px, 1fr);
    min-height: 560px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 26px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 34px 100px rgba(0, 0, 0, .38);
}

.recovery-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 92% 12%, rgba(246, 138, 0, .12), transparent 16rem),
        linear-gradient(90deg, transparent, rgba(255, 255, 255, .7));
}

.recovery-visual,
.recovery-panel {
    position: relative;
    z-index: 1;
}

.recovery-visual {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 42px 36px;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(0, 47, 90, .94), rgba(8, 24, 44, .88)),
        radial-gradient(circle at 20% 24%, rgba(246, 138, 0, .36), transparent 14rem);
}

.recovery-logo {
    width: 190px;
    min-height: 58px;
    display: inline-flex;
    align-items: center;
}

.recovery-logo img {
    width: 100%;
    max-height: 58px;
    object-fit: contain;
    display: block;
}

.recovery-kicker {
    margin: 34px 0 12px;
    color: #ffb257;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.recovery-visual h1 {
    margin: 0;
    max-width: 380px;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.02;
    letter-spacing: 0;
}

.recovery-visual p {
    max-width: 410px;
    margin: 18px 0 0;
    color: rgba(255, 255, 255, .78);
    font-size: 16px;
    line-height: 1.65;
}

.recovery-points {
    display: grid;
    gap: 12px;
    margin-top: 28px;
}

.recovery-points span {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(255, 255, 255, .88);
    font-weight: 650;
}

.recovery-points span::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #f68a00;
    box-shadow: 0 0 0 5px rgba(246, 138, 0, .16);
}

.recovery-support-note {
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 18px;
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .72);
}

.recovery-panel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 52px 44px;
    color: #071f3d;
}

.recovery-panel .back-link {
    position: static;
    align-self: flex-start;
    margin-bottom: 24px;
    color: #607087;
    font-weight: 750;
}

.recovery-panel .back-link:hover {
    color: #f68a00;
}

.recovery-eyebrow {
    margin: 0 0 8px;
    color: #f68a00;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.recovery-panel h2 {
    margin: 0;
    color: #002f5a;
    font-size: clamp(30px, 3vw, 42px);
    line-height: 1.06;
}

.recovery-copy {
    margin: 13px 0 24px;
    color: #63758b;
    line-height: 1.65;
}

.recovery-form {
    display: grid;
    gap: 14px;
}

.recovery-form label {
    display: grid;
    gap: 8px;
    color: #1d2e44;
    font-size: 14px;
    font-weight: 850;
}

.recovery-form .recovery-input {
    width: 100%;
    min-height: 56px;
    border: 1px solid #ccd8e8;
    border-radius: 16px;
    padding: 0 18px;
    color: #071f3d;
    background: #f9fbff;
    font: inherit;
    font-weight: 650;
    outline: none;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.recovery-form .recovery-input:focus {
    border-color: #f68a00;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(246, 138, 0, .12);
}

.recovery-submit {
    min-height: 56px;
    border: 0;
    border-radius: 16px;
    color: #fff;
    background: #003f73;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 16px 28px rgba(0, 63, 115, .18);
}

.recovery-submit:hover {
    background: #f68a00;
}

.recovery-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 18px;
}

.recovery-actions a {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d6e1ef;
    border-radius: 15px;
    color: #003f73;
    background: #fff;
    text-decoration: none;
    font-weight: 900;
}

.recovery-actions .wa {
    color: #fff;
    border-color: #18b866;
    background: #18b866;
}

.reset-message,
.reset-error {
    margin: 0 0 16px;
    padding: 13px 15px;
    border-radius: 16px;
    line-height: 1.45;
    font-weight: 700;
}

.reset-message {
    color: #087247;
    background: #ecfff5;
    border: 1px solid #bff3d4;
}

.reset-error {
    color: #b42318;
    background: #fff2f2;
    border: 1px solid #ffd0d0;
}

@media (max-width: 820px) {
    .recovery-card {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .recovery-visual {
        padding: 28px 24px;
    }

    .recovery-support-note {
        margin-top: 24px;
    }

    .recovery-panel {
        padding: 32px 24px 28px;
    }
}

@media (max-width: 520px) {
    .recovery-actions {
        grid-template-columns: 1fr;
    }
}

.back-link {
    position: absolute;
    top: 16px;
    left: 18px;
    color: #9ca3af;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    z-index: 1;
}

.back-link:hover {
    color: #fff;
}

.auth-brand {
    position: relative;
    z-index: 1;
    padding: 10px 0 18px;
    text-align: center;
}

.signup-page {
    min-height: 100vh;
    padding: 24px;
    background:
        radial-gradient(circle at 18% 18%, rgba(255, 90, 127, .22), transparent 18rem),
        radial-gradient(circle at 86% 16%, rgba(92, 124, 250, .24), transparent 18rem),
        linear-gradient(145deg, #0f172a, #182235 58%, #111827);
}

.signup-shell {
    width: min(980px, 100%);
    min-height: calc(100vh - 48px);
    display: grid;
    place-items: center;
    margin: 0 auto;
}

.signup-panel {
    position: relative;
    width: 100%;
    padding: 28px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 18px;
    color: #fff;
    background: rgba(15, 23, 42, .88);
    box-shadow: 0 30px 80px rgba(0, 0, 0, .34);
}

.signup-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 22px;
    padding-left: 76px;
}

.signup-head p {
    margin: 0 0 4px;
    color: #ff9ab3;
    font-weight: 500;
    text-transform: uppercase;
}

.signup-head h1 {
    margin: 0;
    font-size: 32px;
}

.signup-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.signup-grid label {
    display: grid;
    gap: 6px;
    color: #cbd5e1;
    font-size: 13px;
    font-weight: 500;
    text-transform: uppercase;
}

.signup-grid input,
.signup-grid textarea {
    width: 100%;
    min-height: 42px;
    border: 1px solid rgba(203, 213, 225, .28);
    border-radius: 9px;
    padding: 10px 12px;
    color: #fff;
    background: rgba(255, 255, 255, .08);
    font: inherit;
}

.signup-grid textarea {
    resize: vertical;
}

.signup-grid .span-2 {
    grid-column: 1 / -1;
}

.signup-panel form > button {
    width: 100%;
    min-height: 48px;
    margin-top: 16px;
    border: 0;
    border-radius: 10px;
    color: #fff;
    background: linear-gradient(135deg, #ff5a7f, #5c7cfa);
    font: inherit;
    font-weight: 500;
    cursor: pointer;
}

.form-alert {
    margin-bottom: 14px;
    padding: 11px 12px;
    border: 1px solid #bbf7d0;
    border-radius: 9px;
    color: #14532d;
    background: #f0fdf4;
}

.form-alert.danger {
    border-color: #fecaca;
    color: #7f1d1d;
    background: #fef2f2;
}

.signup-page {
    background:
        radial-gradient(circle at 12% 10%, rgba(92, 124, 250, .08), transparent 18rem),
        radial-gradient(circle at 90% 8%, rgba(255, 90, 127, .06), transparent 18rem),
        linear-gradient(180deg, #fff 0%, #f8fbff 100%);
}

.light-signup {
    width: min(980px, 100%);
}

.light-signup .signup-panel {
    padding: 0;
    color: #172033;
    background: #fff;
    border-color: #e2e8f0;
    overflow: hidden;
    box-shadow: 0 24px 56px rgba(15, 23, 42, .08);
}

.signup-back {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 32px;
    padding: 0 10px;
    border-radius: 999px;
    background: #f8fbff;
    color: #334155;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    z-index: 2;
}

.signup-top-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.signup-back svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.signup-login-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 13px;
    border: 1px solid #d8e2f1;
    border-radius: 999px;
    color: #26354f;
    background: #fff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .06);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
}

.signup-login-link:hover {
    color: #fff;
    border-color: #4051b5;
    background: #4051b5;
}

.signup-back:hover {
    color: #111827;
}

.signup-content {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(310px, .82fr);
    gap: 0;
    align-items: stretch;
}

.signup-form-card {
    padding: 24px 28px 22px;
    background: #fff;
}

.light-signup .signup-head {
    display: flex;
    align-items: center;
    gap: 12px;
    width: fit-content;
    margin: 0 0 16px auto;
    max-width: calc(100% - 190px);
    transform: translateX(8px);
    padding-left: 0;
    color: inherit;
    text-decoration: none;
}

.light-signup .signup-head p {
    color: #5c7cfa;
    font-size: 11px;
}

.light-signup .signup-head h1 {
    color: #0f172a;
    font-size: 22px;
}

.light-signup .signup-grid {
    gap: 8px 12px;
}

.light-signup .signup-grid label {
    position: relative;
    min-width: 0;
    color: #b8bed0;
    font-size: 11px;
    letter-spacing: .02em;
}

.light-signup .signup-grid input,
.light-signup .signup-grid textarea,
.light-signup .signup-grid select {
    min-height: 34px;
    border-color: #c7d2e4;
    border-radius: 6px;
    color: #111827;
    background: #fff;
    font-size: 12px;
    font-weight: 400;
}

.light-signup .signup-grid input,
.light-signup .signup-grid select {
    height: 34px;
}

.password-field,
.experience-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    min-width: 0;
}

.password-field {
    position: relative;
    display: block;
}

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

.password-field button {
    position: absolute;
    top: 50%;
    right: 6px;
    width: 24px;
    height: 24px;
    min-height: 0;
    margin: 0;
    transform: translateY(-50%);
    border: 0;
    border-radius: 6px;
    color: #64748b;
    background: #edf3fb;
    box-shadow: none;
    font-size: 12px;
}

.password-field button.showing {
    color: #fff;
    background: #111827;
}

.experience-row {
    grid-template-columns: 1fr 1fr;
}

.experience-row select,
.password-field input {
    min-width: 0;
    width: 100%;
}

.tag-select {
    position: relative;
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    max-width: 100%;
    min-height: 34px;
    height: 34px;
    width: 100%;
    padding: 3px 5px;
    border: 1px solid #b9c8df;
    border-radius: 6px;
    background: #fff;
    box-shadow: inset 0 1px 0 rgba(15, 23, 42, .02);
}

.light-signup .signup-grid .tag-select input.tag-input {
    flex: 1 1 74px;
    min-width: 74px;
    min-height: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    border-radius: 0;
    color: #111827;
    background: transparent;
    font-size: 12px;
    font-weight: 400;
    outline: 0;
}

.light-signup .signup-grid .tag-select input.tag-input::placeholder {
    color: #64748b;
    font-weight: 400;
}

.tag-chips {
    display: flex;
    flex: 0 1 66%;
    min-width: 0;
    flex-wrap: nowrap;
    gap: 4px;
    margin: 0;
    max-width: 66%;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
}

.tag-chips::-webkit-scrollbar {
    display: none;
}

.tag-chips button {
    flex: 0 0 auto;
    width: auto;
    max-width: 78px;
    min-height: 22px;
    height: 22px;
    margin: 0;
    padding: 2px 7px 2px 9px;
    border: 0;
    border-radius: 6px;
    background: #40519b;
    color: #fff;
    box-shadow: none;
    font-size: 10.5px;
    font-weight: 400;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tag-chips span {
    margin-left: 7px;
    color: rgba(255, 255, 255, .82);
    font-size: 14px;
    line-height: 1;
}

.tag-suggestions {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 1px);
    z-index: 40;
    display: none;
    max-height: 116px;
    overflow: auto;
    padding: 0;
    border: 1px solid #d6deea;
    border-radius: 0 0 5px 5px;
    background: #fff;
    box-shadow: 0 12px 24px rgba(15, 23, 42, .12);
}

.tag-suggestions.open {
    display: block;
}

.tag-suggestions button {
    width: 100%;
    min-height: 28px;
    margin: 0;
    padding: 4px 10px;
    border: 0;
    border-radius: 0;
    color: #111827;
    background: #fff;
    box-shadow: none;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.25;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tag-suggestions button:hover {
    color: #111827;
    background: #eef2f7;
}

.light-signup .signup-grid textarea {
    min-height: 64px;
}

.light-signup .signup-panel form > button {
    min-height: 42px;
    margin-top: 14px;
    border-radius: 9px;
    background: linear-gradient(135deg, #f43f5e, #e11d48);
    box-shadow: 0 12px 24px rgba(225, 29, 72, .22);
}

.light-signup .signup-panel .password-field button {
    width: 24px;
    min-height: 24px;
    height: 24px;
    margin: 0;
    padding: 0;
    background: #edf3fb;
    box-shadow: none;
}

.light-signup .signup-panel .tag-chips button,
.light-signup .signup-panel .tag-suggestions button {
    width: auto;
    min-height: 24px;
    margin: 0;
    box-shadow: none;
    font-weight: 400;
}

.light-signup .signup-panel .tag-suggestions button {
    width: 100%;
}

.light-signup .signup-panel .tag-suggestions button:hover {
    color: #111827;
    background: #eef2f7;
}

.signup-benefits {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 18px;
    border-left: 1px solid #edf2f8;
    border-radius: 0;
    background:
        radial-gradient(circle at 12% 10%, rgba(255, 90, 127, .06), transparent 10rem),
        linear-gradient(160deg, #fff, #f7fbff);
}

.benefit-visual {
    width: 100%;
    height: 108px;
    margin-bottom: 12px;
    object-fit: cover;
    border: 1px solid #d8e2f1;
    border-radius: 12px;
    box-shadow: 0 10px 22px rgba(15, 23, 42, .06);
}

.signup-benefits > span {
    width: fit-content;
    padding: 3px 8px;
    border-radius: 999px;
    color: #4051b5;
    background: #eef0ff;
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
}

.signup-benefits h2 {
    margin: 10px 0 6px;
    color: #0f172a;
    font-size: 21px;
    line-height: 1.1;
}

.signup-benefits p {
    margin: 0;
    color: #64748b;
    font-size: 12.5px;
    line-height: 1.45;
}

.benefit-list {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}

.benefit-list article {
    position: relative;
    display: grid;
    grid-template-columns: 30px 1fr;
    gap: 8px;
    align-items: center;
    min-height: 58px;
    padding: 9px 11px;
    border: 1px solid #d8e2f1;
    border-left-width: 4px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .05);
}

.benefit-list article.blue {
    border-left-color: #2563eb;
}

.benefit-list article.green {
    border-left-color: #34d399;
}

.benefit-list article.pink {
    border-left-color: #e11d48;
}

.benefit-list i {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 7px;
    background: #eff6ff;
    color: #2563eb;
}

.benefit-list article.green i {
    color: #047857;
    background: #ecfdf5;
}

.benefit-list article.pink i {
    color: #be123c;
    background: #fff1f2;
}

.benefit-list svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.benefit-list strong,
.benefit-list small {
    display: block;
}

.benefit-list strong {
    color: #111827;
    font-size: 12.5px;
}

.benefit-list small {
    margin-top: 2px;
    color: #64748b;
    font-size: 11.5px;
    line-height: 1.35;
}

.benefit-note {
    margin-top: 10px;
    padding: 8px 10px;
    border: 1px solid #99f6e4;
    border-radius: 8px;
    color: #065f46;
    background: linear-gradient(135deg, #d1fae5, #ccfbf1);
    font-size: 12px;
    font-weight: 500;
}

.terms-check {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 12px;
    color: #475569;
    font-size: 13px;
    font-weight: 400;
}

.terms-check input {
    width: 16px;
    height: 16px;
    accent-color: #e11d48;
}

.terms-check a {
    color: #4051b5;
    font-weight: 500;
    text-decoration: none;
}

.terms-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: none;
    place-items: center;
    padding: 18px;
    background: rgba(15, 23, 42, .48);
    backdrop-filter: blur(8px);
}

.terms-modal.open {
    display: grid;
}

.terms-box {
    width: min(760px, 100%);
    max-height: min(82vh, 720px);
    overflow: hidden;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .28);
}

.terms-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 20px;
    border-bottom: 1px solid #e2e8f0;
    background: #f8fbff;
}

.terms-head h2 {
    margin: 0;
    color: #0f172a;
    font-size: 22px;
}

.terms-head button {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 999px;
    color: #334155;
    background: #eaf0f8;
    cursor: pointer;
    font-size: 22px;
}

.terms-content {
    max-height: calc(82vh - 72px);
    overflow: auto;
    padding: 20px;
    color: #334155;
    line-height: 1.65;
}

.legal-page {
    min-height: 100vh;
    background: #fff;
}

.legal-shell {
    width: min(1060px, calc(100% - 32px));
    margin: 0 auto;
    padding: 22px 0 8px;
}

.legal-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.legal-nav a {
    color: #334155;
    text-decoration: none;
    font-weight: 800;
}

.legal-card {
    padding: 18px 0 34px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.legal-card > span {
    display: inline-flex;
    padding: 0;
    border-radius: 0;
    color: #0b3c6f;
    background: transparent;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.legal-card h1 {
    display: none;
}

.legal-content {
    color: #334155;
    line-height: 1.7;
}

.legal-content .page-hero-content {
    margin: 6px 0 34px;
    padding: 0 0 24px;
    border-bottom: 1px solid #d8e2f1;
    border-radius: 0;
    color: #fff;
    background: transparent;
}

.legal-content .page-hero-content h2 {
    margin: 10px 0;
    color: #0f172a;
    font-size: 38px;
    line-height: 1.12;
}

.legal-content .page-hero-content p {
    max-width: 860px;
    color: #475569;
    font-size: 17px;
}

.legal-content .page-kicker,
.legal-content .card-kicker {
    display: inline-flex;
    width: fit-content;
    padding: 5px 10px;
    border-radius: 999px;
    color: #0b3c6f;
    background: #eef5ff;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.legal-content .page-hero-content .page-kicker {
    color: #0b3c6f;
    border: 0;
    background: #eef5ff;
}

.legal-content .highlight-band,
.legal-content .content-grid,
.legal-content .split-showcase,
.legal-content .legal-wrap {
    display: grid;
    gap: 26px;
    margin-top: 26px;
}

.legal-content .highlight-band {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.legal-content .content-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.legal-content .split-showcase {
    grid-template-columns: .95fr 1.05fr;
}

.legal-content .highlight-band > div,
.legal-content .content-grid > section,
.legal-content .split-showcase > section,
.legal-content .legal-wrap > section,
.legal-content .policy-note {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.legal-content .policy-note {
    display: block;
    margin: 0 0 20px;
    color: #64748b;
    font-size: 13px;
    font-weight: 800;
}

.legal-content .highlight-band,
.legal-content .content-grid,
.legal-content .split-showcase,
.legal-content .legal-wrap {
    padding-bottom: 28px;
    border-bottom: 1px solid #e3ebf5;
}

.legal-content .highlight-band strong {
    display: block;
    color: #0f172a;
    font-size: 18px;
}

.legal-content .highlight-band span {
    display: block;
    margin-top: 5px;
    color: #64748b;
    font-size: 13px;
}

.legal-content h2,
.legal-content h3 {
    color: #0f172a;
}

.legal-content h3 {
    margin: 0 0 8px;
    font-size: 20px;
}

.legal-content p,
.legal-content li {
    color: #475569;
    font-size: 15px;
    line-height: 1.75;
}

.legal-content ul {
    margin: 8px 0 0;
    padding-left: 20px;
}

.legal-content a {
    color: #0b3c6f;
    font-weight: 800;
}

.institution-hero {
    padding: 24px 0 18px;
    border-bottom: 1px solid #e3ebf5;
}

.institution-hero span {
    color: #0b3c6f;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.institution-hero h1 {
    margin: 7px 0;
    color: #0f172a;
    font-size: 34px;
    line-height: 1.08;
}

.institution-hero p {
    max-width: 880px;
    margin: 0;
    color: #475569;
    font-size: 15px;
    line-height: 1.55;
}

.institution-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 14px;
    padding: 18px;
    border: 1px solid #e5edf6;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 18px 55px rgba(8, 43, 80, .08);
}

.institution-register-layout {
    display: grid;
    grid-template-columns: minmax(230px, .62fr) minmax(0, 1.38fr);
    gap: 18px;
    align-items: start;
    padding: 18px 0 28px;
}

.institution-side-panel {
    position: sticky;
    top: 18px;
    padding: 20px;
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(145deg, #082b50, #0b3c6f);
    box-shadow: 0 18px 50px rgba(8, 43, 80, .18);
}

.institution-side-panel > span,
.form-section-head span {
    color: #ff8a00;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.institution-side-panel h2 {
    margin: 10px 0;
    color: #fff;
    font-size: 23px;
    line-height: 1.18;
}

.institution-side-panel p {
    margin: 0;
    color: rgba(255, 255, 255, .78);
    font-size: 14px;
    line-height: 1.55;
}

.institution-step-list {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}

.institution-step-list div {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 2px 12px;
    align-items: center;
}

.institution-step-list b {
    grid-row: span 2;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    color: #082b50;
    background: #ff8a00;
}

.institution-step-list strong {
    color: #fff;
    font-size: 13px;
}

.institution-step-list small {
    color: rgba(255, 255, 255, .72);
    font-size: 12px;
}

.institution-login-cta {
    margin-top: 18px;
    padding: 13px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 14px;
    background: rgba(255, 255, 255, .08);
}

.institution-login-cta small {
    display: block;
    margin-bottom: 8px;
    color: rgba(255, 255, 255, .72);
    font-size: 12px;
    font-weight: 800;
}

.institution-login-cta a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    border-radius: 10px;
    color: #082b50;
    background: #fff;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none;
}

.institution-login-cta a:hover {
    color: #082b50;
    background: #ff8a00;
}

.form-section-head {
    padding-bottom: 4px;
    border-bottom: 1px solid #eef3f8;
}

.form-section-head h2 {
    margin: 5px 0 0;
    color: #082b50;
    font-size: 18px;
}

.institution-form label {
    display: grid;
    gap: 5px;
    color: #334155;
    font-size: 13px;
    font-weight: 800;
}

.institution-form input,
.institution-form select,
.institution-form textarea {
    width: 100%;
    border: 1px solid #d8e2f1;
    border-radius: 10px;
    padding: 10px 11px;
    color: #0f172a;
    background: #fbfdff;
    font: inherit;
    font-weight: 600;
}

.institution-form textarea {
    resize: vertical;
}

.institution-form .manual-field {
    display: none;
    margin-top: 4px;
    border-color: #f3bf82;
    background: #fffaf3;
}

.institution-form .manual-field.show {
    display: block;
}

.institution-form input:focus,
.institution-form select:focus,
.institution-form textarea:focus {
    outline: 3px solid rgba(255, 138, 0, .15);
    border-color: #ff8a00;
    background: #fff;
}

.institution-form .span-2,
.otp-box {
    grid-column: 1 / -1;
}

.otp-box {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) auto auto;
    align-items: end;
    gap: 10px;
    padding: 10px;
    border: 1px solid #ffe1bd;
    border-radius: 13px;
    background: #fffaf4;
}

.otp-box button,
.institution-submit button {
    min-height: 39px;
    border: 0;
    border-radius: 9px;
    padding: 0 13px;
    color: #fff;
    background: #ff8a00;
    font: inherit;
    font-size: 14px;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 10px 22px rgba(255, 138, 0, .18);
}

.otp-box small {
    grid-column: 1 / -1;
    color: #64748b;
    font-weight: 800;
    font-size: 12px;
}

.otp-box small.ok {
    color: #047857;
}

.otp-box small.bad {
    color: #b91c1c;
}

.institution-submit {
    display: flex;
    align-items: center;
    gap: 14px;
    justify-content: flex-end;
    padding-top: 4px;
}

.institution-submit a {
    color: #0b3c6f;
    font-weight: 900;
    text-decoration: none;
}

.form-alert {
    margin-top: 18px;
    padding: 12px 14px;
    border-radius: 10px;
    font-weight: 800;
}

.form-alert-success {
    color: #047857;
    background: #ecfdf5;
}

.form-alert-error {
    color: #b91c1c;
    background: #fef2f2;
}

.institute-login-shell {
    max-width: 980px;
}

.institute-login-card {
    max-width: 640px;
    margin: 42px auto 52px;
    padding: 28px 30px 30px;
    border: 1px solid #e5edf6;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 18px 55px rgba(8, 43, 80, .08);
}

.institute-login-card > div:first-child span,
.institute-login-card > span {
    color: #ff8a00;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.institute-login-card h1 {
    margin: 8px 0;
    color: #082b50;
    font-size: 30px;
    line-height: 1.15;
}

.institute-login-card p {
    margin: 0 0 18px;
    color: #64748b;
    line-height: 1.6;
}

.institute-login-card form {
    display: grid;
    gap: 15px;
}

.institute-login-card label {
    display: grid;
    gap: 6px;
    color: #334155;
    font-size: 13px;
    font-weight: 800;
}

.institute-login-card input {
    width: 100%;
    border: 1px solid #d8e2f1;
    border-radius: 11px;
    min-height: 46px;
    padding: 11px 13px;
    font: inherit;
}

.institute-login-card input:focus {
    outline: 3px solid rgba(255, 138, 0, .15);
    border-color: #ff8a00;
}

.institute-login-card button {
    min-height: 42px;
    border: 0;
    border-radius: 10px;
    color: #fff;
    background: #ff8a00;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.institute-register-link {
    color: #1f5eff;
    text-align: center;
    text-decoration: none;
    font-weight: 900;
}

.institution-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
}

.institution-dashboard-grid div {
    padding: 12px;
    border: 1px solid #e5edf6;
    border-radius: 12px;
    background: #fbfdff;
}

.institution-dashboard-grid b,
.institution-dashboard-grid span {
    display: block;
}

.institution-dashboard-grid b {
    color: #082b50;
    font-size: 12px;
}

.institution-dashboard-grid span {
    margin-top: 4px;
    color: #475569;
    font-size: 13px;
}

.auth-brand .logo-mark {
    width: 48px;
    height: 48px;
    margin-bottom: 12px;
    font-size: 15px;
    box-shadow: 0 16px 35px rgba(255, 85, 122, .2);
}

.auth-brand p {
    margin: 0 0 5px;
    color: #9ca3af;
    font-size: 12px;
    font-weight: 400;
    text-transform: uppercase;
}

.auth-brand h1 {
    margin: 0;
    font-size: 25px;
    font-weight: 500;
    line-height: 1.1;
}

.toast {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 10;
    width: min(360px, calc(100% - 32px));
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 15px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 16px;
    color: #fff;
    background: rgba(15, 23, 42, .94);
    box-shadow: 0 22px 60px rgba(0, 0, 0, .36);
    backdrop-filter: blur(18px);
    animation: toastIn .38s ease-out both;
}

.toast::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 0;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, #ff557a, #4f7cff);
    animation: toastLine 4.5s linear both;
}

.toast-mark {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 10px;
    color: #fff;
    background: linear-gradient(135deg, #ff557a, #b8325d);
    font-weight: 700;
}

.toast strong,
.toast p {
    margin: 0;
}

.toast strong {
    display: block;
    font-size: 14px;
}

.toast p {
    margin-top: 3px;
    color: #cbd5e1;
    font-size: 13px;
    line-height: 1.4;
}

.field {
    position: relative;
    z-index: 1;
    height: 42px;
    margin-bottom: 9px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 12px;
    background: rgba(255, 255, 255, .07);
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.field:focus-within {
    border-color: rgba(255, 85, 122, .7);
    background: rgba(255, 255, 255, .095);
    box-shadow: 0 0 0 4px rgba(255, 85, 122, .1);
}

.icon {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    color: #cbd5e1;
}

.icon svg {
    width: 17px;
    height: 17px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.fake-input {
    position: fixed;
    top: -120px;
    left: -120px;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.field input {
    width: 100%;
    border: 0;
    outline: 0;
    color: #fff;
    background: transparent;
    font-size: 13px;
    font-weight: 400;
}

.field input:-webkit-autofill,
.field input:-webkit-autofill:hover,
.field input:-webkit-autofill:focus {
    -webkit-text-fill-color: #fff;
    transition: background-color 9999s ease-out;
    box-shadow: 0 0 0 1000px transparent inset;
}

.field input::placeholder {
    color: #9ca3af;
}

.form-row {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 5px 0 14px;
    color: #aeb7c4;
    font-size: 13px;
    font-weight: 400;
}

.remember {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.remember input {
    width: 16px;
    height: 16px;
    accent-color: #ff557a;
}

.form-row a {
    color: #d1d5db;
    text-decoration: none;
}

button {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 42px;
    border: 0;
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(135deg, #f0527d, #7d58c8 48%, #3f6ed8);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    box-shadow: 0 16px 32px rgba(63, 110, 216, .28);
    transition: transform .16s ease, box-shadow .16s ease;
}

button:hover {
    transform: translateY(-1px);
    box-shadow: 0 20px 38px rgba(63, 110, 216, .33);
}

.role-dashboard-page {
    color: #0f172a;
    background:
        radial-gradient(circle at 18% 16%, rgba(92, 124, 250, .08), transparent 18rem),
        radial-gradient(circle at 82% 18%, rgba(255, 85, 122, .06), transparent 18rem),
        #fff;
}

.role-dashboard-page::before {
    opacity: .35;
}

.role-dashboard {
    width: min(820px, calc(100% - 28px));
}

.role-card {
    padding: 24px;
    border: 1px solid #d8e2f1;
    border-radius: 16px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .1);
}

.role-top {
    display: flex;
    align-items: center;
    gap: 14px;
}

.role-top p {
    margin: 0 0 4px;
    color: #4051b5;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
}

.role-top h1 {
    margin: 0;
    font-size: 24px;
    font-weight: 500;
}

.role-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 22px;
}

.role-grid article {
    padding: 14px;
    border: 1px solid #d8e2f1;
    border-radius: 10px;
    background: #f8fbff;
}

.role-grid span,
.role-grid strong {
    display: block;
}

.role-grid span {
    color: #64748b;
    font-size: 12px;
}

.role-grid strong {
    margin-top: 5px;
    color: #0f172a;
    font-size: 14px;
    font-weight: 500;
}

.role-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
}

.role-actions form {
    margin: 0;
}

.role-actions a {
    padding: 10px 14px;
    border: 1px solid #d8e2f1;
    border-radius: 10px;
    color: #26354f;
    background: #fff;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
}

.role-actions a.danger {
    color: #fff;
    border-color: #e11d48;
    background: #e11d48;
}

.back-admin-btn {
    width: auto;
    height: 38px;
    padding: 0 15px;
    border: 0;
    border-radius: 10px;
    color: #fff;
    background: #111827;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    box-shadow: 0 12px 24px rgba(15, 23, 42, .16);
}

@keyframes toastIn {
    from {
        opacity: 0;
        transform: translateY(-10px) translateX(16px);
    }
    to {
        opacity: 1;
        transform: translateY(0) translateX(0);
    }
}

@keyframes toastLine {
    from {
        transform: scaleX(1);
        transform-origin: left;
    }
    to {
        transform: scaleX(0);
        transform-origin: left;
    }
}

.error-page {
    display: grid;
    place-items: center;
    padding: 18px;
    color: #fff;
    background: #111827;
}

.error-box {
    width: min(380px, 100%);
    padding: 34px 24px;
    text-align: center;
    border-radius: 18px;
    background: #1f2937;
}

.error-box h1 {
    margin: 0;
    font-size: 72px;
}

.error-box a {
    color: #ff8aa3;
    font-weight: 650;
}

.site-footer {
    margin-top: 56px;
    padding: 54px 0 26px;
    color: #334155;
    background: #fff;
    border-top: 1px solid #e5edf6;
    box-shadow: 0 -18px 48px rgba(8, 43, 80, .045);
}

.site-footer-inner {
    width: 92%;
    max-width: 1540px;
    margin: 0 auto;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.55fr repeat(3, 1fr);
    gap: 34px;
}

.footer-brand-col h4 {
    max-width: 440px;
    margin: 10px 0 12px;
    color: #082b50;
    font-size: 22px;
    line-height: 1.22;
}

.footer-logo-img {
    width: min(240px, 100%);
    height: auto;
    display: block;
    margin-bottom: 14px;
    background: transparent;
    box-shadow: none;
    filter: none;
}

.footer-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #68e0ff;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.site-footer h4 {
    margin: 0 0 14px;
    color: #082b50;
    font-size: 15px;
}

.site-footer p,
.site-footer a {
    color: #475569;
    font-size: 14px;
    line-height: 1.8;
}

.site-footer p {
    max-width: 500px;
    margin: 0;
}

.site-footer a {
    display: block;
    margin: 3px 0;
    text-decoration: none;
    transition: color .18s ease, transform .18s ease;
}

.site-footer a:hover {
    color: #ff8a00;
    transform: translateX(3px);
}

.footer-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.footer-pill-row span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 11px;
    border: 1px solid #ffd7a6;
    border-radius: 999px;
    color: #082b50;
    background: #fff7ed;
    font-size: 12px;
    font-weight: 800;
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    margin-top: 34px;
    padding-top: 22px;
    border-top: 1px solid #e5edf6;
    color: #64748b;
    font-size: 13px;
}

@media (max-width: 720px) {
    .site-header-inner {
        width: min(100% - 24px, 560px);
        min-height: auto;
        padding: 14px 0;
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .site-header-brand img {
        width: 160px;
        max-height: 48px;
    }

    .site-header-nav {
        width: 100%;
        justify-content: flex-start;
        gap: 18px;
        padding-bottom: 2px;
    }

    .site-header-nav a,
    .site-header-action {
        font-size: 15px;
    }

    .site-header-action {
        min-height: 38px;
        padding: 0 16px;
    }

    .soon-shell {
        width: min(100% - 24px, 560px);
    }

    .soon-nav {
        padding: 18px 0;
    }

    .soon-hero {
        padding: 58px 0 36px;
    }

    .soon-copy {
        font-size: 16px;
    }

    .soon-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .soon-strip {
        grid-template-columns: 1fr;
    }

    .role-grid {
        grid-template-columns: 1fr;
    }

    .footer-grid {
        grid-template-columns: 1fr;
    }

    .footer-bottom {
        flex-direction: column;
    }

    .legal-content .highlight-band,
    .legal-content .content-grid,
    .legal-content .split-showcase {
        grid-template-columns: 1fr;
    }

    .legal-content .page-hero-content {
        padding: 0 0 22px;
    }

    .legal-content .page-hero-content h2 {
        font-size: 28px;
    }

    .institution-hero h1 {
        font-size: 32px;
    }

    .institution-form,
    .otp-box {
        grid-template-columns: 1fr;
    }

    .institution-register-layout {
        grid-template-columns: 1fr;
    }

    .institution-side-panel {
        display: none;
    }

    .institution-form {
        padding: 18px;
        border-radius: 18px;
    }

    .institution-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .institute-login-card {
        margin-top: 20px;
        padding: 18px;
    }

    .signup-content,
    .signup-grid {
        grid-template-columns: 1fr;
    }

    .signup-form-card,
    .signup-benefits {
        padding: 20px 16px;
    }

    .benefit-visual {
        height: 96px;
    }

    .signup-login-link {
        height: 32px;
        padding: 0 12px;
        font-size: 12px;
    }

    .light-signup .signup-head {
        margin: 0 0 18px;
        max-width: none;
        transform: none;
    }

    .signup-grid .span-2 {
        grid-column: auto;
    }

    .signup-page {
        padding: 8px;
    }

    .signup-shell {
        min-height: calc(100vh - 24px);
    }
}

@media (max-width: 440px) {
    .auth-page {
        display: block;
        padding: 0;
        background: #111827;
    }

    .auth-page.signup-page {
        background: #fff;
    }

    .auth-shell {
        width: 100%;
        min-height: 100vh;
    }

    .auth-card {
        min-height: 100vh;
        display: flex;
        flex-direction: column;
        justify-content: center;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        padding: 34px 18px;
    }

    .auth-brand {
        padding-top: 0;
    }

    .toast {
        top: 12px;
        right: 12px;
        left: 12px;
        width: auto;
    }
}

/* Gyan Nexa institute account panel skin. */
.institute-login-shell {
    --gr-navy: #06345f;
    --gr-navy-soft: #0b416f;
    --gr-orange: #f68a00;
    --gr-page: #f4f7fb;
    --gr-line: #d6e3ee;
}

body.legal-page:has(.institute-login-shell) {
    background: var(--gr-page);
}

.institute-login-shell .legal-nav {
    min-height: 66px;
    margin-top: 14px;
    padding: 10px 18px;
    border: 1px solid rgba(6, 52, 95, .12);
    border-bottom: 3px solid var(--gr-orange);
    border-radius: 10px;
    background: var(--gr-navy);
    box-shadow: 0 10px 26px rgba(6, 52, 95, .14);
}

.institute-login-shell .legal-nav .soon-brand {
    min-height: 44px;
    padding: 5px 10px;
    border-radius: 8px;
    background: #ffffff;
}

.institute-login-shell .legal-nav .soon-brand img {
    max-height: 38px;
    object-fit: contain;
}

.institute-login-shell .back-admin-btn {
    border: 1px solid rgba(255, 255, 255, .2);
    background: rgba(255, 255, 255, .12);
    color: #ffffff;
    font-weight: 800;
}

.institute-login-shell .back-admin-btn:hover {
    background: var(--gr-orange);
    color: #ffffff;
}

.institute-login-card {
    border: 1px solid var(--gr-line) !important;
    border-top: 3px solid var(--gr-orange) !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: 0 16px 38px rgba(6, 52, 95, .1) !important;
}

.institute-login-card > span,
.institute-login-card > div > span {
    color: var(--gr-orange) !important;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.institute-login-card h1 {
    margin: 9px 0 8px !important;
    color: var(--gr-navy) !important;
    font-size: 34px !important;
    letter-spacing: 0;
}

.institute-login-card p {
    margin-bottom: 22px !important;
    color: #64748b;
    font-size: 16px;
}

.institution-dashboard-grid > div {
    border: 1px solid var(--gr-line) !important;
    border-radius: 8px !important;
    background: #eef5fb !important;
}

.institution-dashboard-grid b {
    color: var(--gr-navy) !important;
    font-size: 12px;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.institution-dashboard-grid span {
    color: #1f2d3d !important;
    font-weight: 700;
}

.institution-renewal-form {
    border: 1px solid var(--gr-line);
    border-radius: 10px;
    background: #f8fbff;
}

.institution-renewal-form label {
    color: var(--gr-navy);
    font-weight: 800;
}

.institution-renewal-form select,
.institute-login-card input {
    border-color: #cbd8e5 !important;
    border-radius: 8px !important;
    background: #fbfdff !important;
}

.institution-renewal-form select:focus,
.institute-login-card input:focus {
    border-color: var(--gr-orange) !important;
    box-shadow: 0 0 0 3px rgba(246, 138, 0, .14) !important;
}

.institute-login-card button {
    min-height: 46px !important;
    margin-top: 2px;
    border-radius: 8px !important;
    background: var(--gr-navy) !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    box-shadow: 0 10px 22px rgba(6, 52, 95, .16) !important;
}

.institute-register-link {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    margin-top: 2px;
    border: 1px solid #cbd8e5;
    border-radius: 8px !important;
    background: #f7fafc !important;
    color: var(--gr-navy) !important;
    font-weight: 900 !important;
}

.institute-login-card button:hover {
    background: var(--gr-navy-soft) !important;
    color: #ffffff !important;
}

.institute-register-link:hover {
    border-color: var(--gr-orange);
    background: #fff7ed !important;
    color: var(--gr-navy) !important;
}

.form-alert-success {
    border-color: rgba(15, 157, 88, .22) !important;
    background: rgba(15, 157, 88, .1) !important;
    color: #0f7a45 !important;
}

.form-alert-error {
    border-color: rgba(220, 38, 38, .22) !important;
    background: rgba(220, 38, 38, .09) !important;
    color: #b91c1c !important;
}

/* Institute dashboard reporting surface. */
.institute-dashboard-shell {
    max-width: 1320px !important;
}

.institution-control-hero {
    margin: 22px 0 18px;
    padding: 24px 26px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    border: 1px solid #d6e3ee;
    border-top: 3px solid var(--gr-orange);
    border-radius: 10px;
    background:
        linear-gradient(135deg, rgba(6, 52, 95, .96), rgba(7, 69, 115, .92)),
        #06345f;
    box-shadow: 0 18px 40px rgba(6, 52, 95, .16);
}

.institution-control-hero span,
.institution-panel-card > span,
.institution-card-head span {
    color: var(--gr-orange);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.institution-control-hero h1 {
    margin: 8px 0 8px;
    color: #fff;
    font-size: 34px;
    line-height: 1.08;
}

.institution-control-hero p {
    max-width: 760px;
    margin: 0;
    color: rgba(255, 255, 255, .76);
    font-size: 15px;
    line-height: 1.55;
}

.institution-hero-actions {
    display: grid;
    gap: 10px;
    justify-items: end;
    flex: 0 0 auto;
}

.institution-hero-actions a,
.institution-primary-action {
    min-height: 40px;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: #06345f;
    background: #fff;
    font-weight: 900;
    text-decoration: none;
}

.institution-dashboard-panel {
    padding: 0 0 28px;
}

.institution-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 16px;
}

.institution-kpi-grid article,
.institution-panel-card {
    border: 1px solid #d6e3ee;
    border-top: 3px solid var(--gr-orange);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 14px 32px rgba(6, 52, 95, .08);
}

.institution-kpi-grid article {
    min-height: 122px;
    padding: 18px;
}

.institution-kpi-grid span {
    color: #718096;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.institution-kpi-grid b {
    display: block;
    margin-top: 12px;
    color: #082b50;
    font-size: 28px;
    line-height: 1;
}

.institution-kpi-grid small {
    display: block;
    margin-top: 8px;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
}

.institution-dashboard-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 16px;
    align-items: start;
}

.institution-main-column,
.institution-side-column {
    display: grid;
    gap: 16px;
}

.institution-panel-card {
    padding: 16px;
}

.institution-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.institution-card-head h2,
.institution-panel-card h2 {
    margin: 5px 0 0;
    color: #082b50;
    font-size: 22px;
    line-height: 1.15;
}

.institution-card-head small,
.institution-panel-card p {
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
}

.institution-status-pill {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 11px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.institution-status-pill.success {
    color: #047857;
    background: #dff8ee;
}

.institution-status-pill.warning {
    color: #a16207;
    background: #fff7d6;
}

.institution-status-pill.danger {
    color: #b91c1c;
    background: #fee2e2;
}

.institution-info-grid,
.institution-report-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.institution-info-grid div,
.institution-report-grid div {
    min-width: 0;
    padding: 12px;
    border: 1px solid #e2ebf4;
    border-radius: 8px;
    background: #f8fbff;
}

.institution-info-grid b {
    display: block;
    color: #082b50;
    font-size: 12px;
}

.institution-info-grid span {
    display: block;
    margin-top: 5px;
    overflow: hidden;
    color: #334155;
    font-size: 13px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.institution-report-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.institution-report-grid b {
    display: block;
    color: #082b50;
    font-size: 24px;
    line-height: 1;
}

.institution-report-grid span {
    display: block;
    margin-top: 7px;
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
}

.institution-module-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.institution-module-cloud span {
    padding: 8px 11px;
    border-radius: 999px;
    color: #06345f;
    background: #edf5fb;
    font-size: 12px;
    font-weight: 900;
}

.institution-progress-card ul {
    margin: 14px 0 0;
    padding: 0;
    display: grid;
    gap: 8px;
    list-style: none;
}

.institution-progress-card li {
    position: relative;
    padding-left: 22px;
    color: #64748b;
    font-size: 13px;
    font-weight: 800;
}

.institution-progress-card li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #cbd5e1;
}

.institution-progress-card li.done {
    color: #047857;
}

.institution-progress-card li.done::before {
    background: #10b981;
}

.institution-progress-bar {
    height: 10px;
    margin-top: 14px;
    overflow: hidden;
    border-radius: 999px;
    background: #e2ebf4;
}

.institution-progress-bar i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--gr-orange), #0b78b6);
}

.institution-action-card {
    background: #f8fbff;
}

.institution-primary-action {
    width: 100%;
    margin-top: 10px;
    color: #fff;
    background: var(--gr-navy);
}

.institution-renewal-panel {
    margin-top: 16px;
}

.institution-renewal-panel .institution-renewal-form {
    margin: 0;
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(160px, .5fr) auto;
    align-items: end;
    gap: 12px;
}

.institution-renewal-panel button {
    min-height: 40px;
    border: 0;
    border-radius: 8px;
    padding: 0 18px;
    color: #fff;
    background: var(--gr-navy);
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

@media (max-width: 980px) {
    .institution-control-hero,
    .institution-card-head {
        display: grid;
    }
    .institution-hero-actions {
        justify-items: start;
    }
    .institution-kpi-grid,
    .institution-dashboard-layout {
        grid-template-columns: 1fr;
    }
    .institution-report-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .institution-renewal-panel .institution-renewal-form {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .institution-control-hero {
        padding: 18px;
    }
    .institution-control-hero h1 {
        font-size: 26px;
    }
    .institution-info-grid,
    .institution-report-grid {
        grid-template-columns: 1fr;
    }
}

/* Institute self-service app shell. */
body.institution-app-page {
    margin: 0;
    background: #eef3f8 !important;
}

.institution-app-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    color: #082b50;
    font-family: Arial, Helvetica, sans-serif;
}

.institution-app-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    background: #06345f;
    color: #fff;
    box-shadow: 12px 0 28px rgba(6, 52, 95, .12);
}

.institution-app-logo {
    height: 76px;
    display: grid;
    place-items: center;
    background: #fff;
    border-bottom: 3px solid #f68a00;
}

.institution-app-logo img {
    width: 198px;
    max-height: 50px;
    object-fit: contain;
}

.institution-app-user {
    padding: 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.institution-app-user b {
    width: 42px;
    height: 42px;
    margin-bottom: 10px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    color: #06345f;
    background: #fff;
    font-size: 18px;
}

.institution-app-user span,
.institution-app-user small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.institution-app-user span {
    font-weight: 900;
}

.institution-app-user small {
    margin-top: 3px;
    color: rgba(255, 255, 255, .68);
    font-weight: 700;
}

.institution-app-sidebar nav {
    padding: 10px 0;
    display: grid;
}

.institution-app-sidebar nav a {
    min-height: 46px;
    padding: 0 18px;
    display: flex;
    align-items: center;
    border-left: 4px solid transparent;
    color: rgba(255, 255, 255, .82);
    font-weight: 900;
    text-decoration: none;
}

.institution-app-sidebar nav a:hover,
.institution-app-sidebar nav a.active {
    border-left-color: #f68a00;
    color: #fff;
    background: #0b4d7f;
}

.institution-app-sidebar form {
    margin-top: auto;
    padding: 16px;
}

.institution-app-sidebar button {
    width: 100%;
    min-height: 40px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 8px;
    color: #fff;
    background: rgba(255, 255, 255, .1);
    font-weight: 900;
    cursor: pointer;
}

.institution-app-main {
    min-width: 0;
    padding: 0 18px 28px;
}

.institution-app-topbar {
    height: 76px;
    margin: 0 -18px 16px;
    padding: 0 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    background: #06345f;
    border-bottom: 3px solid #f68a00;
    color: #fff;
}

.institution-app-topbar span {
    display: block;
    color: rgba(255, 255, 255, .68);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.institution-app-topbar strong {
    display: block;
    margin-top: 4px;
    font-size: 22px;
}

.institution-top-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.institution-top-actions a {
    min-height: 38px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    border-radius: 8px;
    color: #06345f;
    background: #fff;
    font-weight: 900;
    text-decoration: none;
}

.institution-app-main .institution-control-hero {
    margin-top: 0;
}

.institution-renewal-panel .institution-renewal-form,
.institution-ticket-form {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.institution-renewal-form label,
.institution-ticket-form label {
    display: grid;
    gap: 6px;
    color: #082b50;
    font-size: 13px;
    font-weight: 900;
}

.institution-renewal-form select,
.institution-ticket-form select,
.institution-ticket-form input,
.institution-ticket-form textarea,
.institution-inline-payment input {
    width: 100%;
    min-height: 38px;
    border: 1px solid #cbd8e5;
    border-radius: 7px;
    padding: 8px 10px;
    background: #fbfdff;
    font: inherit;
}

.institution-payment-note {
    margin-top: 12px;
    padding: 12px;
    border-radius: 8px;
    color: #334155;
    background: #f8fbff;
    font-size: 13px;
}

.institution-payment-note b,
.institution-payment-note span {
    display: block;
}

.institution-payment-note span {
    margin-top: 4px;
    line-height: 1.45;
}

.institution-table-wrap {
    overflow: visible;
}

.institution-mini-table {
    width: 100%;
    border-collapse: collapse;
}

.institution-mini-table th,
.institution-mini-table td {
    padding: 11px 10px;
    border-bottom: 1px solid #e2ebf4;
    text-align: left;
    vertical-align: middle;
}

.institution-mini-table th {
    color: #082b50;
    background: #edf5fb;
    font-size: 12px;
    text-transform: uppercase;
}

.institution-mini-table td {
    color: #1f2937;
    font-size: 13px;
    font-weight: 700;
}

.institution-mini-table small {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
}

.institution-inline-payment {
    display: grid;
    grid-template-columns: minmax(120px, 1fr) auto;
    gap: 6px;
}

.institution-inline-payment button,
.institution-ticket-form button {
    min-height: 38px;
    border: 0;
    border-radius: 7px;
    padding: 0 14px;
    color: #fff;
    background: #06345f;
    font-weight: 900;
    cursor: pointer;
}

.institution-ticket-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.institution-ticket-form .span-2 {
    grid-column: 1 / -1;
}

.institution-ticket-form button {
    width: max-content;
}

.institution-ticket-list {
    margin-top: 14px;
    display: grid;
    gap: 8px;
}

.institution-ticket-list p,
.institution-ticket-list div {
    margin: 0;
    padding: 10px;
    border: 1px solid #e2ebf4;
    border-radius: 8px;
    background: #f8fbff;
}

.institution-ticket-list b,
.institution-ticket-list span,
.institution-ticket-list small {
    display: block;
}

.institution-ticket-list b {
    color: #06345f;
    font-size: 12px;
}

.institution-ticket-list span {
    margin-top: 3px;
    color: #1f2937;
    font-weight: 900;
}

.institution-ticket-list small {
    margin-top: 3px;
    color: #64748b;
    font-weight: 700;
}

@media (max-width: 900px) {
    .institution-app-shell {
        grid-template-columns: 1fr;
    }
    .institution-app-sidebar {
        position: static;
        height: auto;
    }
    .institution-app-sidebar nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .institution-app-sidebar form {
        margin-top: 0;
    }
}

@media (max-width: 620px) {
    .institution-app-topbar,
    .institution-top-actions {
        display: grid;
        height: auto;
    }
    .institution-app-topbar {
        padding: 14px;
    }
    .institution-ticket-form,
    .institution-inline-payment {
        grid-template-columns: 1fr;
    }
}

/* Compact institute dashboard override. */
body.institution-app-page {
    font-size: 14px;
}

.institution-app-shell {
    grid-template-columns: 230px minmax(0, 1fr);
}

.institution-app-sidebar {
    box-shadow: 8px 0 18px rgba(6, 52, 95, .10);
}

.institution-app-logo {
    height: 64px;
}

.institution-app-logo img {
    width: 184px;
    max-height: 42px;
}

.institution-app-user {
    padding: 14px 16px;
}

.institution-app-user b {
    width: 34px;
    height: 34px;
    margin-bottom: 8px;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 700;
}

.institution-app-user span {
    font-size: 14px;
    font-weight: 700;
}

.institution-app-user small {
    font-size: 12px;
    font-weight: 600;
}

.institution-app-sidebar nav a {
    min-height: 40px;
    padding: 0 16px;
    font-size: 14px;
    font-weight: 700;
}

.institution-app-sidebar button {
    min-height: 36px;
    font-weight: 700;
}

.institution-app-main {
    padding: 0 14px 22px;
}

.institution-app-topbar {
    height: 64px;
    margin: 0 -14px 14px;
    padding: 0 18px;
}

.institution-app-topbar span {
    font-size: 11px;
    font-weight: 700;
}

.institution-app-topbar strong {
    font-size: 18px;
    font-weight: 700;
}

.institution-top-actions a,
.institution-hero-actions a,
.institution-primary-action {
    min-height: 34px;
    padding: 0 14px;
    font-size: 13px;
    font-weight: 700;
}

.institution-status-pill {
    min-height: 26px;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 700;
}

.institution-control-hero {
    margin-bottom: 14px;
    padding: 18px 20px;
    border-radius: 8px;
    box-shadow: 0 12px 26px rgba(6, 52, 95, .12);
}

.institution-control-hero span,
.institution-panel-card > span,
.institution-card-head span {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .05em;
}

.institution-control-hero h1 {
    margin: 7px 0 6px;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.12;
}

.institution-control-hero p {
    max-width: 780px;
    font-size: 14px;
    line-height: 1.45;
}

.institution-kpi-grid {
    gap: 12px;
    margin-bottom: 14px;
}

.institution-kpi-grid article {
    min-height: 98px;
    padding: 14px 15px;
    border-radius: 8px;
}

.institution-kpi-grid span {
    font-size: 11px;
    font-weight: 700;
}

.institution-kpi-grid b {
    margin-top: 10px;
    font-size: 23px;
    font-weight: 700;
}

.institution-kpi-grid small {
    margin-top: 6px;
    font-size: 12px;
    font-weight: 600;
}

.institution-dashboard-layout {
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 14px;
}

.institution-main-column,
.institution-side-column {
    gap: 14px;
}

.institution-panel-card {
    padding: 14px;
    border-radius: 8px;
    box-shadow: 0 10px 24px rgba(6, 52, 95, .07);
}

.institution-card-head {
    margin-bottom: 12px;
}

.institution-card-head h2,
.institution-panel-card h2 {
    font-size: 20px;
    font-weight: 600;
}

.institution-card-head small,
.institution-panel-card p {
    font-size: 12px;
    line-height: 1.45;
}

.institution-info-grid,
.institution-report-grid {
    gap: 8px;
}

.institution-info-grid div,
.institution-report-grid div {
    padding: 10px 11px;
    border-radius: 7px;
}

.institution-info-grid b {
    font-size: 12px;
    font-weight: 700;
}

.institution-info-grid span {
    font-size: 13px;
    font-weight: 600;
}

.institution-report-grid b {
    font-size: 21px;
    font-weight: 700;
}

.institution-report-grid span,
.institution-module-cloud span,
.institution-progress-card li,
.institution-mini-table td,
.institution-ticket-list span {
    font-weight: 600;
}

.institution-progress-card ul {
    margin-top: 12px;
    gap: 7px;
}

.institution-progress-bar {
    height: 8px;
}

.institution-mini-table th,
.institution-mini-table td {
    padding: 9px 8px;
}

.institution-mini-table th {
    font-size: 11px;
    font-weight: 700;
}

.institution-renewal-panel .institution-renewal-form {
    grid-template-columns: minmax(260px, 1fr) 170px 150px;
    gap: 10px;
    align-items: end;
}

.institution-renewal-panel button,
.institution-inline-payment button,
.institution-ticket-form button {
    min-height: 34px;
    font-size: 13px;
    font-weight: 700;
}

/* Refined institute content look. */
.institution-app-main {
    background:
        linear-gradient(180deg, rgba(246, 138, 0, .06), rgba(246, 138, 0, 0) 210px),
        #eef3f8;
}

.institution-app-topbar {
    box-shadow: 0 10px 24px rgba(6, 52, 95, .12);
}

.institution-control-hero {
    color: #082b50;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, .98), rgba(248, 251, 255, .96)),
        #fff;
    border: 1px solid #d6e3ee;
    border-top: 3px solid #f68a00;
}

.institution-control-hero h1 {
    color: #082b50;
}

.institution-control-hero p {
    color: #52677a;
}

.institution-hero-actions a {
    color: #fff;
    background: #06345f;
}

.institution-kpi-grid article {
    position: relative;
    overflow: hidden;
    border-top-width: 0;
}

.institution-kpi-grid article::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: #f68a00;
}

.institution-kpi-grid article::after {
    content: "";
    position: absolute;
    right: 14px;
    top: 14px;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: #eef5fb;
}

.institution-kpi-grid article:nth-child(2)::after {
    background: #fff3df;
}

.institution-kpi-grid article:nth-child(3)::after {
    background: #e8f8f0;
}

.institution-kpi-grid article:nth-child(4)::after {
    background: #eff6ff;
}

.institution-kpi-grid span,
.institution-card-head span,
.institution-panel-card > span {
    color: #f68a00;
}

.institution-kpi-grid b {
    color: #06345f;
}

.institution-panel-card {
    border-top-width: 2px;
    background: #fff;
}

.institution-card-head {
    padding-bottom: 10px;
    border-bottom: 1px solid #edf2f7;
}

.institution-info-grid div {
    background: linear-gradient(180deg, #fbfdff, #f6f9fd);
}

.institution-info-grid b {
    color: #64748b;
}

.institution-info-grid span {
    color: #082b50;
}

.institution-report-grid div {
    position: relative;
    padding-left: 13px;
    background: #fbfdff;
}

.institution-report-grid div::before {
    content: "";
    position: absolute;
    left: 0;
    top: 12px;
    bottom: 12px;
    width: 3px;
    border-radius: 99px;
    background: #f68a00;
}

.institution-module-cloud span {
    border: 1px solid #d6e3ee;
    color: #06345f;
    background: #f8fbff;
}

.institution-progress-card {
    background:
        linear-gradient(180deg, rgba(6, 52, 95, .04), rgba(6, 52, 95, 0)),
        #fff;
}

.institution-action-card {
    border-color: #b8d5ec;
    background:
        linear-gradient(135deg, rgba(6, 52, 95, .07), rgba(246, 138, 0, .08)),
        #fff;
}

.institution-action-card h2,
.institution-progress-card h2 {
    color: #06345f;
}

.institution-mini-table {
    overflow: hidden;
    border: 1px solid #e2ebf4;
    border-radius: 8px;
}

.institution-mini-table th {
    color: #06345f;
    background: #edf5fb;
}

.institution-mini-table tbody tr:hover td {
    background: #fbfdff;
}

.institution-ticket-form,
.institution-renewal-panel .institution-renewal-form {
    padding: 12px;
    border: 1px solid #e2ebf4;
    border-radius: 8px;
    background: #fbfdff;
}

.institution-renewal-panel .institution-renewal-form label {
    min-width: 0;
}

.institution-renewal-panel .institution-renewal-form select {
    min-height: 38px;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 600;
}

.institution-renewal-panel .institution-renewal-form button {
    width: 100%;
    color: #fff !important;
    background: #06345f !important;
    opacity: 1 !important;
    box-shadow: 0 8px 18px rgba(6, 52, 95, .14);
}

.institution-renewal-panel .institution-renewal-form button:hover {
    background: #0b4d7f !important;
}

.institution-renewal-panel .institution-card-head h2,
.institution-billing-panel .institution-card-head h2,
.institution-support-panel .institution-card-head h2 {
    font-weight: 600;
}

.institution-ticket-list div {
    border-left: 3px solid #f68a00;
}

.institution-payment-note {
    border: 1px dashed #f3bf82;
    background: #fffaf3;
}

/* Final compact polish for institute dashboard content. */
.institution-app-shell {
    grid-template-columns: 220px minmax(0, 1fr);
}

.institution-app-main {
    padding: 0 12px 18px;
}

.institution-app-topbar {
    height: 58px;
    margin: 0 -12px 12px;
}

.institution-app-logo {
    height: 58px;
}

.institution-app-logo img {
    width: 174px;
}

.institution-app-user {
    padding: 12px 14px;
}

.institution-app-user b {
    width: 30px;
    height: 30px;
    margin-bottom: 7px;
}

.institution-app-sidebar nav a {
    min-height: 37px;
    font-size: 13px;
}

.institution-control-hero {
    min-height: 96px;
    margin-bottom: 10px;
    padding: 14px 16px;
    align-items: center;
}

.institution-control-hero h1 {
    max-width: 780px;
    margin: 5px 0 4px;
    font-size: 21px;
    font-weight: 600;
}

.institution-control-hero p {
    max-width: 900px;
    font-size: 13px;
    line-height: 1.35;
}

.institution-hero-actions {
    gap: 8px;
}

.institution-kpi-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
    margin-bottom: 10px;
}

.institution-kpi-grid article {
    min-height: 82px;
    padding: 11px 12px 10px 14px;
}

.institution-kpi-grid article::after {
    width: 26px;
    height: 26px;
    right: 10px;
    top: 10px;
    border-radius: 8px;
}

.institution-kpi-grid span {
    font-size: 10px;
}

.institution-kpi-grid b {
    margin-top: 8px;
    font-size: 20px;
}

.institution-kpi-grid small {
    max-width: 88%;
    margin-top: 4px;
    overflow: hidden;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.institution-dashboard-layout {
    grid-template-columns: minmax(0, 1fr) 282px;
    gap: 10px;
}

.institution-main-column,
.institution-side-column {
    gap: 10px;
}

.institution-panel-card {
    padding: 11px 12px;
    border-top-width: 2px;
}

.institution-card-head {
    margin-bottom: 9px;
    padding-bottom: 8px;
}

.institution-card-head h2,
.institution-panel-card h2 {
    margin-top: 3px;
    font-size: 17px;
    font-weight: 600;
}

.institution-card-head span,
.institution-panel-card > span {
    font-size: 10px;
}

.institution-info-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
}

.institution-info-grid div,
.institution-report-grid div {
    padding: 8px 9px;
}

.institution-info-grid b {
    font-size: 11px;
}

.institution-info-grid span {
    margin-top: 3px;
    font-size: 12px;
}

.institution-report-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
}

.institution-report-grid div::before {
    top: 9px;
    bottom: 9px;
}

.institution-report-grid b {
    font-size: 18px;
}

.institution-report-grid span {
    margin-top: 4px;
    font-size: 11px;
}

.institution-module-cloud {
    gap: 6px;
}

.institution-module-cloud span {
    padding: 6px 9px;
    font-size: 11px;
}

.institution-progress-card ul {
    margin-top: 9px;
    gap: 6px;
}

.institution-progress-card li {
    padding-left: 18px;
    font-size: 12px;
}

.institution-progress-card li::before {
    width: 10px;
    height: 10px;
}

.institution-progress-bar {
    height: 7px;
    margin-top: 10px;
}

.institution-action-card p,
.institution-panel-card p {
    margin: 6px 0 0;
    font-size: 12px;
}

.institution-primary-action {
    min-height: 32px;
    margin-top: 8px;
}

.institution-renewal-panel,
.institution-billing-panel,
.institution-support-panel {
    margin-top: 10px;
}

.institution-renewal-panel .institution-renewal-form {
    grid-template-columns: minmax(260px, 1fr) 150px 132px;
    padding: 9px;
}

.institution-renewal-form label,
.institution-ticket-form label {
    gap: 4px;
    font-size: 12px;
}

.institution-renewal-form select,
.institution-ticket-form select,
.institution-ticket-form input,
.institution-ticket-form textarea,
.institution-inline-payment input {
    min-height: 34px;
    padding: 7px 9px;
    font-size: 12px;
}

.institution-payment-note {
    margin-top: 9px;
    padding: 9px 10px;
    font-size: 12px;
}

.institution-mini-table th,
.institution-mini-table td {
    padding: 7px 8px;
}

.institution-mini-table td {
    font-size: 12px;
}

.institution-ticket-form {
    padding: 9px;
    gap: 8px;
}

.institution-ticket-list {
    margin-top: 10px;
    gap: 6px;
}

.institution-ticket-list p,
.institution-ticket-list div {
    padding: 8px 9px;
}

.institution-ticket-list b,
.institution-ticket-list small {
    font-size: 11px;
}

.institution-ticket-list span {
    font-size: 12px;
}

/* Premium topbar finish for institute dashboard. */
.institution-app-topbar {
    height: 64px;
    margin: 0 -12px 14px;
    padding: 0 18px 0 22px;
    position: sticky;
    top: 0;
    z-index: 12;
    background:
        linear-gradient(90deg, #06365f 0%, #073f6f 54%, #064577 100%) !important;
    border-bottom: 0;
    box-shadow: 0 10px 24px rgba(6, 52, 95, .18);
}

.institution-app-topbar::after {
    content: "";
    position: absolute;
    left: 22px;
    right: 22px;
    bottom: 0;
    height: 3px;
    border-radius: 99px 99px 0 0;
    background: linear-gradient(90deg, #f68a00, #ffc266 48%, #f68a00);
}

.institution-top-title {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.institution-top-title > b {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 10px;
    color: #fff;
    background: rgba(255, 255, 255, .12);
    font-size: 14px;
    font-weight: 700;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10);
}

.institution-top-title > div {
    min-width: 0;
}

.institution-app-topbar span {
    display: block;
    color: rgba(255, 255, 255, .68);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .10em;
    text-transform: uppercase;
}

.institution-app-topbar strong {
    max-width: 760px;
    margin-top: 1px;
    overflow: hidden;
    color: #fff;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.institution-app-topbar small {
    display: block;
    margin-top: 1px;
    overflow: hidden;
    color: rgba(255, 255, 255, .70);
    font-size: 11px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.institution-top-actions {
    gap: 8px;
    padding: 4px;
    flex: 0 0 auto;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 12px;
    background: rgba(255, 255, 255, .10);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.institution-top-actions .institution-status-pill {
    min-height: 31px;
    padding: 0 12px;
    border: 1px solid rgba(16, 185, 129, .18);
    border-radius: 8px;
    color: #047857;
    background: #e7fff4;
    font-size: 12px;
    font-weight: 700;
}

.institution-top-actions a {
    min-height: 31px;
    padding: 0 13px;
    border-radius: 8px;
    color: #06345f;
    background: #fff;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 8px 18px rgba(0, 0, 0, .12);
}

.institution-top-actions a:hover {
    color: #fff;
    background: #f68a00;
}

/* Institute dashboard final simple premium pass. */
.institution-app-topbar {
    height: 58px;
    margin: 0 -12px 12px;
    padding: 0 20px;
    background: #073e6b !important;
    box-shadow: 0 8px 18px rgba(7, 62, 107, .16);
}

.institution-app-topbar::after {
    left: 0;
    right: 0;
    height: 3px;
    border-radius: 0;
    background: #f68a00;
}

.institution-top-title {
    gap: 10px;
}

.institution-top-title > b {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
    border-radius: 8px;
    background: rgba(255, 255, 255, .11);
    font-size: 13px;
}

.institution-app-topbar span {
    color: rgba(255, 255, 255, .72);
    font-size: 9px;
    letter-spacing: .08em;
}

.institution-app-topbar strong {
    max-width: 720px;
    font-size: 15px;
    line-height: 1.12;
}

.institution-app-topbar small {
    color: rgba(255, 255, 255, .72);
    font-size: 10px;
}

.institution-top-actions {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.institution-top-actions .institution-status-pill,
.institution-top-actions a {
    min-height: 31px;
    border-radius: 7px;
    box-shadow: none;
}

.institution-top-actions .institution-status-pill {
    min-height: auto;
    padding: 0;
    border: 0;
    color: #ff9a1f !important;
    background: transparent !important;
    font-size: 13px;
}

.institution-top-actions a,
.institution-hero-actions a,
.institution-primary-action,
.institution-renewal-panel .institution-renewal-form button,
.institution-ticket-form button,
.institution-domain-form button,
.institution-inline-payment button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    border: 0;
    border-radius: 7px;
    color: #fff !important;
    background: #063e6d !important;
    font-weight: 700;
    text-decoration: none;
    opacity: 1 !important;
}

.institution-top-actions a {
    color: #063e6d !important;
    background: #fff !important;
}

.institution-page-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 10px;
    padding: 11px 14px;
    border: 1px solid #d7e5f0;
    border-top: 2px solid #f68a00;
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 7px 16px rgba(15, 44, 71, .06);
}

.institution-page-heading span {
    display: block;
    color: #f68a00;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.institution-page-heading h1 {
    margin: 3px 0 2px;
    color: #082b50;
    font-size: 20px;
    font-weight: 600;
}

.institution-page-heading p {
    margin: 0;
    color: #60758a;
    font-size: 12px;
}

.institution-page-heading .institution-status-pill {
    color: #f68a00 !important;
    background: transparent !important;
    border: 0;
    white-space: nowrap;
}

.institution-top-actions a:hover,
.institution-hero-actions a:hover,
.institution-primary-action:hover,
.institution-renewal-panel .institution-renewal-form button:hover,
.institution-ticket-form button:hover,
.institution-domain-form button:hover,
.institution-inline-payment button:hover {
    color: #fff !important;
    background: #f68a00 !important;
}

.institution-control-hero {
    min-height: 86px;
    padding: 12px 16px;
    border-radius: 7px;
    box-shadow: 0 8px 18px rgba(15, 44, 71, .06);
}

.institution-control-hero h1 {
    font-size: 19px;
}

.institution-control-hero p {
    max-width: 820px;
}

.institution-kpi-grid article {
    min-height: 76px;
    border-radius: 7px;
    box-shadow: 0 7px 16px rgba(15, 44, 71, .06);
}

.institution-panel-card {
    border-radius: 7px;
    box-shadow: 0 7px 16px rgba(15, 44, 71, .06);
}

.institution-card-head {
    align-items: center;
}

.institution-info-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.institution-info-grid div {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr);
    align-items: center;
    min-height: 42px;
    padding: 8px 10px;
    border-radius: 7px;
}

.institution-info-grid b,
.institution-info-grid span {
    margin: 0;
}

.institution-info-grid span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.institution-report-grid div {
    min-height: 54px;
    border-radius: 7px;
}

.institution-domain-panel {
    border-top-color: #f68a00;
}

.institution-domain-layout {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(360px, 1.05fr);
    gap: 10px;
    align-items: stretch;
}

.institution-domain-summary {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    padding: 10px 12px;
    border: 1px solid #d7e5f0;
    border-radius: 7px;
    background: #f8fbff;
}

.institution-domain-summary b {
    overflow: hidden;
    color: #06345f;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.institution-domain-summary span,
.institution-domain-summary small {
    color: #52677a;
    font-size: 12px;
    line-height: 1.35;
}

.institution-domain-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, .95fr) auto;
    gap: 8px;
    align-items: end;
    padding: 10px;
    border: 1px solid #d7e5f0;
    border-radius: 7px;
    background: #fff;
}

.institution-domain-form label {
    display: grid;
    gap: 4px;
    color: #082b50;
    font-size: 12px;
    font-weight: 700;
}

.institution-domain-form input {
    width: 100%;
    min-height: 34px;
    padding: 7px 9px;
    border: 1px solid #cbd9e6;
    border-radius: 6px;
    color: #082b50;
    font-size: 12px;
}

.institution-domain-form button {
    padding: 0 13px;
    white-space: nowrap;
}

.staff-lead-update {
    display: grid;
    grid-template-columns: 112px 122px minmax(140px, 1fr) 58px;
    gap: 5px;
    min-width: 460px;
}

.staff-lead-update select,
.staff-lead-update input {
    min-height: 30px;
    padding: 5px 7px;
    border: 1px solid #cbd9e6;
    border-radius: 5px;
    color: #082b50;
    font-size: 11px;
}

.staff-lead-update button {
    min-height: 30px;
    font-size: 11px;
}

.institution-action-card {
    background: #fff;
}

.institution-action-card .institution-primary-action {
    width: 100%;
    color: #fff !important;
}

@media (max-width: 1100px) {
    .institution-domain-layout,
    .institution-domain-form,
    .institution-info-grid {
        grid-template-columns: 1fr;
    }

    .institution-info-grid div {
        grid-template-columns: 1fr;
    }
}

/* Sadmin staff CRM compact controls. */
.gr-compact-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px 12px;
    align-items: end;
}

.gr-compact-form label {
    display: grid;
    gap: 4px;
    min-width: 0;
    color: #082b50;
    font-size: 12px;
    font-weight: 700;
}

.gr-compact-form label.span-2 {
    grid-column: span 2;
}

.gr-compact-form label.span-3 {
    grid-column: span 3;
}

.gr-compact-form .form-control {
    min-height: 34px;
    padding: 7px 9px;
    border: 1px solid #cbd9e6;
    border-radius: 4px;
    color: #082b50;
    font-size: 12px;
}

.gr-compact-form .btn {
    min-height: 34px;
    border-radius: 5px;
    background: #063e6d;
}

.gr-check-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    min-height: 34px;
    padding: 6px 8px;
    border: 1px solid #d7e5f0;
    border-radius: 4px;
    background: #f8fbff;
}

.gr-check-row label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin: 0;
    font-size: 12px;
    font-weight: 700;
}

.gr-register-table .gr-cell-title {
    display: block;
    max-width: 320px;
    overflow: hidden;
    color: #082b50;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gr-register-table .gr-cell-subtitle {
    display: block;
    max-width: 320px;
    overflow: hidden;
    color: #60758a;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .gr-compact-form,
    .gr-compact-form label.span-2,
    .gr-compact-form label.span-3 {
        grid-template-columns: 1fr;
        grid-column: auto;
    }
}

/* LOGIN_PREMIUM_RESET_V2 */
body.auth-page{display:block;min-height:100vh;padding:0;color:#0f172a;background:linear-gradient(180deg,#f6f9fd 0%,#eef4fb 100%);overflow-x:hidden}
body.auth-page:before{display:none}
.auth-page .gn-header{position:sticky;top:0;z-index:50;width:100%;margin:0;border-radius:0;background:#07111f;box-shadow:0 1px 0 rgba(255,255,255,.06)}
.auth-page .gn-header-inner{width:min(1220px,94%);height:76px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:22px}
.auth-page .gn-logo img{width:150px;max-height:48px;object-fit:contain}
.auth-page .gn-nav{display:flex;align-items:center;justify-content:center;gap:26px;flex:1}
.auth-page .gn-nav a{color:#e7edf6;text-decoration:none;font-size:14px;font-weight:600;white-space:nowrap}
.auth-page .gn-nav a:hover,.auth-page .gn-nav a.active{color:#fff}
.auth-page .gn-actions{display:flex;align-items:center;gap:12px}
.auth-page .gn-actions a{min-height:42px;display:inline-flex;align-items:center;justify-content:center;padding:0 18px;border-radius:9px;color:#fff;text-decoration:none;font-size:14px;font-weight:700;border:1px solid #506177;background:transparent}
.auth-page .gn-actions a:last-child{border-color:#ff8500;background:#ff8500;color:#fff}
.auth-shell{width:min(430px,calc(100% - 32px));min-height:calc(100vh - 76px);margin:0 auto;display:grid;place-items:center;padding:42px 0}
.auth-card{width:100%;padding:30px 28px 28px;border:1px solid #d8e1ee;border-radius:18px;background:#fff;color:#0f172a;box-shadow:0 22px 55px rgba(15,23,42,.10);backdrop-filter:none}
.auth-card:before{display:none}.back-link{position:static;display:inline-flex;margin:0 0 18px;color:#64748b;text-decoration:none;font-size:13px;font-weight:500}.back-link:hover{color:#0f172a}.auth-brand{padding:0 0 22px;text-align:center}.auth-brand .logo-mark{width:62px;height:62px;margin:0 auto 13px;border:1px solid #dbe4f0;border-radius:16px;background:#fff;box-shadow:0 8px 18px rgba(15,23,42,.08);overflow:hidden}.auth-brand .logo-mark img{width:100%;height:100%;object-fit:contain;padding:5px}.auth-brand p{margin:0 0 4px;color:#64748b;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.auth-brand h1{margin:0;color:#0f172a;font-size:27px;line-height:1.15;font-weight:700}.auth-card form{display:grid;gap:12px}.field{position:relative;display:block}.field .icon{position:absolute;left:15px;top:50%;width:20px;height:20px;transform:translateY(-50%);color:#64748b;z-index:1}.field .icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.field input{width:100%;height:52px;border:1px solid #cfd8e6;border-radius:12px;background:#f9fbfe;color:#111827;padding:0 15px 0 48px;font:inherit;font-size:14px;font-weight:400;outline:0;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}.field input::placeholder{color:#8b96a8}.field input:focus{border-color:#6d28d9;background:#fff;box-shadow:0 0 0 4px rgba(109,40,217,.10)}.form-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 4px;color:#526176;font-size:13px}.remember{display:inline-flex;align-items:center;gap:8px}.remember input{width:16px;height:16px;margin:0;accent-color:#6d28d9}.form-row a{color:#4f46e5;text-decoration:none;font-weight:500}.form-row a:hover{text-decoration:underline}.auth-card button[type="submit"]{width:100%;height:52px;border:0;border-radius:12px;background:#ff8500;color:#fff;font:inherit;font-size:15px;font-weight:700;cursor:pointer;box-shadow:0 12px 24px rgba(255,133,0,.20);transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.auth-card button[type="submit"]:hover{background:#f07700;transform:translateY(-1px);box-shadow:0 16px 30px rgba(255,133,0,.24)}.fake-input{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}.toast{position:fixed;right:22px;top:94px;z-index:80;max-width:360px;border-radius:12px;background:#fff;color:#0f172a;border:1px solid #fecaca;box-shadow:0 16px 36px rgba(15,23,42,.14)}
@media(max-width:820px){.auth-page .gn-nav{display:none}.auth-page .gn-header-inner{height:64px}.auth-page .gn-logo img{width:128px}.auth-page .gn-actions a{min-height:36px;padding:0 12px;font-size:12px}.auth-shell{min-height:calc(100vh - 64px);padding:24px 0;width:min(410px,calc(100% - 28px))}.auth-card{padding:24px 20px;border-radius:16px}.auth-brand h1{font-size:23px}.field input{height:48px}.auth-card button[type="submit"]{height:48px}.toast{left:14px;right:14px;top:76px;max-width:none}}
@media(max-width:520px){.auth-page .gn-actions a:first-child{display:none}.auth-page .gn-actions a:last-child{min-height:34px;padding:0 11px;border-radius:8px}.auth-shell{place-items:start center;padding-top:28px}.auth-card{box-shadow:0 14px 34px rgba(15,23,42,.09)}.back-link{margin-bottom:12px}.auth-brand .logo-mark{width:56px;height:56px}.form-row{font-size:12px}.auth-page .gn-logo img{width:118px}}
/* LOGIN_MENU_CLASS_FIX */
.auth-page .gnHeader{position:sticky;top:0;z-index:90;width:100%;background:#07111f;box-shadow:0 1px 0 rgba(255,255,255,.06)}
.auth-page .gnHeaderInner{width:min(1180px,94%);min-height:66px;height:66px;margin:0 auto;display:flex;align-items:center;gap:22px}
.auth-page .gnLogo{min-width:210px}.auth-page .gnLogo img{height:52px;width:auto;object-fit:contain}.auth-page .gnNav{gap:22px}.auth-page .gnNav a{font-size:14px;font-weight:600;color:#eef4fb;text-decoration:none}.auth-page .gnActions{gap:10px}.auth-page .gnBtn{min-height:40px;border-radius:10px;padding:0 16px;font-size:13px;font-weight:700;text-decoration:none}.auth-page .gnBtn.primary{background:#ff8500;border-color:#ff8500;box-shadow:none}.auth-page .gnBottomNav{display:none}
@media(max-width:720px){.auth-page .gnHeaderInner{width:100%;height:58px;min-height:58px;padding:0 14px;justify-content:center}.auth-page .gnLogo{min-width:0}.auth-page .gnLogo img{height:44px}.auth-page .gnBottomNav{display:grid}}