:root {
    --auth-ink: #0a1b2e;
    --auth-ink-soft: #233a52;
    --auth-navy: #081a2f;
    --auth-navy-light: #102d4d;
    --auth-blue: #1677ff;
    --auth-blue-dark: #075dcc;
    --auth-cyan: #73e6f4;
    --auth-lime: #c8f768;
    --auth-paper: #f2f5f1;
    --auth-card: #ffffff;
    --auth-line: #d9e1e7;
    --auth-muted: #66788a;
    --auth-danger: #c9364f;
    --auth-success: #087b5b;
    --auth-warning: #a85b09;
    --auth-shadow: 0 30px 70px rgba(7, 27, 49, .14);
}

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

html { min-width: 320px; background: var(--auth-paper); }

body.auth-body {
    min-height: 100vh;
    min-height: 100dvh;
    margin: 0;
    overflow-x: hidden;
    background: var(--auth-paper);
    color: var(--auth-ink);
    font-family: 'DM Sans', sans-serif;
    -webkit-font-smoothing: antialiased;
}

.auth-body a { color: inherit; }
.auth-body button, .auth-body input { font: inherit; }

.auth-skip-link {
    position: fixed;
    top: 12px;
    left: 12px;
    z-index: 2000;
    padding: 10px 14px;
    border-radius: 10px;
    background: #fff;
    color: var(--auth-ink) !important;
    box-shadow: var(--auth-shadow);
    transform: translateY(-160%);
    transition: transform .2s ease;
}

.auth-skip-link:focus { transform: translateY(0); }

.auth-stage {
    min-height: 100vh;
    min-height: 100dvh;
    display: grid;
    grid-template-columns: minmax(420px, .9fr) minmax(520px, 1.1fr);
    background: var(--auth-paper);
}

.auth-brand-panel {
    position: relative;
    min-height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: clamp(28px, 4vw, 64px);
    background:
        radial-gradient(circle at 82% 18%, rgba(115, 230, 244, .16), transparent 28%),
        linear-gradient(145deg, #071626 0%, #0b2440 58%, #0d3155 100%);
    color: #fff;
}

.auth-brand-panel::before {
    content: '';
    position: absolute;
    right: -150px;
    bottom: -150px;
    width: 420px;
    height: 420px;
    border: 1px solid rgba(115, 230, 244, .22);
    border-radius: 50%;
    box-shadow:
        0 0 0 48px rgba(115, 230, 244, .025),
        0 0 0 96px rgba(115, 230, 244, .025);
}

.auth-brand-panel::after {
    content: '01';
    position: absolute;
    right: clamp(30px, 5vw, 84px);
    top: 15%;
    color: rgba(255, 255, 255, .035);
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(10rem, 20vw, 22rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.1em;
}

.auth-brand-panel__grid {
    position: absolute;
    inset: 0;
    opacity: .24;
    background-image:
        linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: linear-gradient(135deg, #000 0%, transparent 72%);
}

.auth-brand {
    position: relative;
    z-index: 2;
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #fff !important;
    text-decoration: none;
}

.auth-brand__mark {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(0,0,0,.18);
}

.auth-brand__mark img { width: 32px; height: 32px; object-fit: contain; }

.auth-brand__name {
    font-family: 'Space Grotesk', sans-serif;
    font-size: .92rem;
    font-weight: 700;
    letter-spacing: .14em;
}

.auth-brand-panel__content {
    position: relative;
    z-index: 2;
    max-width: 610px;
    margin: auto 0;
    padding: clamp(72px, 10vh, 130px) 0 70px;
}

.auth-kicker {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    color: var(--auth-blue-dark);
    font-family: 'Space Grotesk', sans-serif;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .16em;
    line-height: 1.2;
    text-transform: uppercase;
}

.auth-kicker--light { color: var(--auth-cyan); }

.auth-kicker--light::before {
    content: '';
    width: 28px;
    height: 1px;
    margin-right: 10px;
    background: currentColor;
}

.auth-brand-panel h1 {
    max-width: 650px;
    margin: 24px 0 20px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(2.6rem, 5vw, 5.2rem);
    font-weight: 600;
    letter-spacing: -.065em;
    line-height: .98;
}

.auth-brand-panel__content > p {
    max-width: 520px;
    margin: 0;
    color: rgba(235, 244, 251, .7);
    font-size: clamp(1rem, 1.3vw, 1.16rem);
    line-height: 1.7;
}

.auth-feature-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 34px;
}

.auth-feature-list span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 999px;
    background: rgba(255,255,255,.05);
    color: rgba(255,255,255,.82);
    font-size: .82rem;
    font-weight: 600;
}

.auth-feature-list i { color: var(--auth-lime); }

.auth-brand-panel__footer {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,.1);
    color: rgba(255,255,255,.48);
    font-size: .76rem;
    letter-spacing: .04em;
}

.auth-live-dot { display: inline-flex; align-items: center; gap: 9px; color: rgba(255,255,255,.72); }
.auth-live-dot i { width: 7px; height: 7px; border-radius: 50%; background: var(--auth-lime); box-shadow: 0 0 0 5px rgba(200,247,104,.1); }

.auth-workspace {
    position: relative;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: clamp(28px, 5vw, 78px);
    background:
        radial-gradient(circle at 80% 10%, rgba(22,119,255,.08), transparent 24%),
        var(--auth-paper);
}

.auth-workspace::after {
    content: '';
    position: absolute;
    top: 34px;
    right: 34px;
    width: 54px;
    height: 54px;
    border-top: 2px solid rgba(22,119,255,.18);
    border-right: 2px solid rgba(22,119,255,.18);
}

.auth-mobile-brand { display: none; }

.auth-card {
    position: relative;
    z-index: 2;
    width: min(100%, 530px);
    animation: auth-card-in .5s cubic-bezier(.2,.8,.2,1) both;
}

.auth-card--wide { width: min(100%, 650px); }

@keyframes auth-card-in {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: translateY(0); }
}

.auth-card__index {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: clamp(30px, 5vh, 52px);
    color: var(--auth-muted);
    font-family: 'Space Grotesk', sans-serif;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.auth-card__index span:first-child { color: var(--auth-blue-dark); }
.auth-card__index i { width: 44px; height: 1px; flex: 1; background: var(--auth-line); }

.auth-card h2 {
    margin: 0 0 12px;
    color: var(--auth-ink);
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(2.05rem, 4vw, 3.2rem);
    font-weight: 600;
    letter-spacing: -.055em;
    line-height: 1.03;
}

.auth-card__intro {
    max-width: 470px;
    margin: 0 0 34px;
    color: var(--auth-muted);
    font-size: .98rem;
    line-height: 1.6;
}

.auth-form { display: grid; gap: 20px; }
.auth-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.auth-form-grid .auth-field--full { grid-column: 1 / -1; }

.auth-field { min-width: 0; }

.auth-field__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 8px;
}

.auth-field label {
    margin: 0;
    color: var(--auth-ink-soft);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .035em;
}

.auth-field__row a {
    color: var(--auth-blue-dark);
    font-size: .77rem;
    font-weight: 700;
    text-decoration: none;
}

.auth-field__row a:hover { text-decoration: underline; }

.auth-input-wrap { position: relative; }

.auth-input-wrap > i:first-child {
    position: absolute;
    top: 50%;
    left: 16px;
    z-index: 2;
    color: #8292a1;
    font-size: 1.08rem;
    transform: translateY(-50%);
    pointer-events: none;
}

.auth-input {
    width: 100%;
    height: 54px;
    padding: 0 48px 0 46px;
    border: 1px solid var(--auth-line);
    border-radius: 13px;
    outline: 0;
    background: rgba(255,255,255,.72);
    color: var(--auth-ink);
    font-size: .96rem;
    box-shadow: 0 1px 0 rgba(255,255,255,.9) inset;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.auth-input::placeholder { color: #9ba8b4; }
.auth-input:hover { border-color: #bdc9d2; background: #fff; }
.auth-input:focus { border-color: var(--auth-blue); background: #fff; box-shadow: 0 0 0 4px rgba(22,119,255,.1); }
.auth-input.is-invalid { border-color: var(--auth-danger); }

.auth-password-toggle {
    position: absolute;
    top: 50%;
    right: 9px;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #65778a;
    cursor: pointer;
    transform: translateY(-50%);
}

.auth-password-toggle:hover { background: #edf3f7; color: var(--auth-ink); }

.auth-field-feedback, .invalid-feedback {
    display: block;
    margin: 7px 2px 0;
    color: var(--auth-danger);
    font-size: .76rem;
    font-weight: 600;
    line-height: 1.4;
}

.auth-cnpj-feedback { display: none; margin: 7px 2px 0; font-size: .76rem; font-weight: 600; line-height: 1.4; }
.auth-cnpj-feedback.is-visible { display: block; }
.auth-cnpj-feedback.is-loading { color: var(--auth-blue-dark); }
.auth-cnpj-feedback.is-success { color: var(--auth-success); }
.auth-cnpj-feedback.is-warning { color: var(--auth-warning); }

.auth-form-options { display: flex; align-items: center; justify-content: space-between; gap: 18px; }

.auth-check { display: inline-flex; align-items: center; gap: 10px; color: var(--auth-ink-soft); font-size: .82rem; cursor: pointer; }
.auth-check input { width: 18px; height: 18px; margin: 0; accent-color: var(--auth-blue); }

.auth-button {
    min-height: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 13px 20px;
    border: 0;
    border-radius: 13px;
    font-size: .91rem;
    font-weight: 700;
    text-decoration: none !important;
    cursor: pointer;
    transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}

.auth-button--primary {
    background: var(--auth-blue);
    color: #fff !important;
    box-shadow: 0 14px 28px rgba(22,119,255,.22);
}

.auth-button--primary:hover { background: var(--auth-blue-dark); transform: translateY(-1px); box-shadow: 0 18px 34px rgba(22,119,255,.28); }
.auth-button--primary:focus-visible { outline: 3px solid rgba(22,119,255,.25); outline-offset: 3px; }
.auth-button:disabled { opacity: .66; cursor: wait; transform: none; }
.auth-button > i { font-size: 1.1rem; }
.auth-button--block { width: 100%; }

.auth-inline-alert {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    padding: 13px 14px;
    border-radius: 12px;
    font-size: .82rem;
    line-height: 1.45;
}

.auth-inline-alert i { margin-top: 1px; font-size: 1.05rem; }
.auth-inline-alert--danger { background: #fff0f2; color: #9e263b; border: 1px solid #ffd3da; }
.auth-inline-alert--success { background: #eafaf5; color: #08684e; border: 1px solid #c6eee1; }

.auth-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: 28px;
    padding-top: 22px;
    border-top: 1px solid var(--auth-line);
    color: var(--auth-muted);
    font-size: .82rem;
}

.auth-card__footer a { color: var(--auth-blue-dark); font-weight: 700; text-decoration: none; }
.auth-card__footer a:hover { text-decoration: underline; }

.auth-support-link { display: inline-flex; align-items: center; gap: 7px; }

.auth-demo {
    margin-bottom: 26px;
    padding: 16px;
    border: 1px solid #cce0ff;
    border-radius: 14px;
    background: #edf5ff;
}

.auth-demo__label { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; color: #174f99; font-size: .78rem; font-weight: 700; }
.auth-demo__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.auth-demo button { min-height: 40px; border: 1px solid #b8d3f6; border-radius: 10px; background: #fff; color: #194977; font-size: .73rem; font-weight: 700; cursor: pointer; }
.auth-demo button:hover { border-color: var(--auth-blue); color: var(--auth-blue-dark); }

.auth-recaptcha { overflow-x: auto; padding: 12px; border: 1px solid var(--auth-line); border-radius: 13px; background: #fff; }

.auth-status-hero { text-align: center; }
.auth-status-icon { width: 76px; height: 76px; display: grid; place-items: center; margin: 0 auto 28px; border-radius: 24px; background: #e8f2ff; color: var(--auth-blue); font-size: 2rem; transform: rotate(-3deg); }
.auth-status-hero h2 { max-width: 480px; margin-left: auto; margin-right: auto; }
.auth-status-hero .auth-card__intro { margin-left: auto; margin-right: auto; }
.auth-status-hero .auth-button { width: 100%; }
.auth-status-note { margin: 22px 0 0; color: var(--auth-muted); font-size: .79rem; line-height: 1.55; }

.auth-global-message { position: fixed; top: 18px; right: 18px; z-index: 1500; width: min(430px, calc(100% - 36px)); }
.auth-alert { display: flex; align-items: flex-start; gap: 12px; padding: 15px 16px; border: 1px solid; border-radius: 14px; background: #fff; box-shadow: 0 18px 50px rgba(7,27,49,.2); }
.auth-alert > i { margin-top: 2px; font-size: 1.2rem; }
.auth-alert div { display: grid; gap: 2px; }
.auth-alert strong { font-size: .82rem; }
.auth-alert span { color: var(--auth-muted); font-size: .8rem; line-height: 1.4; }
.auth-alert--success { border-color: #bce8da; color: var(--auth-success); }
.auth-alert--danger { border-color: #f3c1ca; color: var(--auth-danger); }

.auth-dialog-backdrop { position: fixed; inset: 0; z-index: 1800; display: grid; place-items: center; padding: 20px; background: rgba(3,14,25,.76); backdrop-filter: blur(10px); }
.auth-dialog { width: min(760px, 100%); display: grid; grid-template-columns: 180px 1fr; overflow: hidden; border-radius: 24px; background: #fff; box-shadow: 0 34px 100px rgba(0,0,0,.34); }
.auth-dialog__signal { position: relative; display: grid; place-items: center; overflow: hidden; background: var(--auth-navy); color: var(--auth-cyan); }
.auth-dialog__signal::after { content: ''; position: absolute; width: 220px; height: 220px; border: 1px solid rgba(115,230,244,.14); border-radius: 50%; box-shadow: 0 0 0 35px rgba(115,230,244,.03); }
.auth-dialog__signal span { position: relative; z-index: 2; width: 76px; height: 76px; display: grid; place-items: center; border: 1px solid rgba(115,230,244,.24); border-radius: 24px; background: rgba(115,230,244,.08); font-size: 2rem; }
.auth-dialog__content { padding: clamp(28px, 5vw, 50px); }
.auth-dialog h2 { margin: 16px 0 12px; font-family: 'Space Grotesk', sans-serif; font-size: clamp(1.7rem, 4vw, 2.45rem); letter-spacing: -.045em; }
.auth-dialog__lead { margin: 0; color: var(--auth-ink-soft); font-weight: 600; }
.auth-dialog__helper { margin: 12px 0 22px; color: var(--auth-muted); line-height: 1.55; }
.auth-dialog__meta { display: grid; gap: 6px; margin-bottom: 22px; padding: 12px 14px; border-radius: 12px; background: #f0f4f7; }
.auth-dialog__meta span { color: var(--auth-muted); font-size: .69rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.auth-dialog__meta code { color: var(--auth-ink-soft); word-break: break-all; }

@media (max-width: 1120px) {
    .auth-stage { grid-template-columns: 380px minmax(0, 1fr); }
    .auth-brand-panel { padding: 34px; }
    .auth-brand-panel h1 { font-size: clamp(2.7rem, 5vw, 4rem); }
    .auth-feature-list { display: grid; }
    .auth-feature-list span { width: fit-content; }
}

@media (max-width: 860px) {
    .auth-stage { display: block; min-height: 100dvh; }
    .auth-brand-panel { display: none; }
    .auth-workspace { min-height: 100dvh; justify-content: flex-start; padding: 22px clamp(20px, 6vw, 54px) 42px; }
    .auth-workspace::after { display: none; }
    .auth-mobile-brand { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: clamp(54px, 10vh, 90px); }
    .auth-mobile-brand .auth-brand { color: var(--auth-ink) !important; }
    .auth-mobile-brand .auth-brand__mark { box-shadow: 0 8px 20px rgba(7,27,49,.1); }
    .auth-mobile-brand .auth-brand__name { font-size: .78rem; }
    .auth-mobile-brand > span { color: var(--auth-muted); font-size: .72rem; font-weight: 600; }
    .auth-card { width: min(100%, 620px); margin: 0 auto; }
}

@media (max-width: 600px) {
    .auth-workspace { padding: 16px 18px 34px; }
    .auth-mobile-brand { margin-bottom: 50px; }
    .auth-mobile-brand > span { display: none; }
    .auth-card__index { margin-bottom: 28px; }
    .auth-card h2 { font-size: 2.15rem; }
    .auth-card__intro { margin-bottom: 28px; }
    .auth-form-grid { grid-template-columns: 1fr; }
    .auth-form-grid .auth-field--full { grid-column: auto; }
    .auth-card__footer { align-items: flex-start; flex-direction: column; }
    .auth-demo__actions { grid-template-columns: 1fr; }
    .auth-dialog { grid-template-columns: 1fr; }
    .auth-dialog__signal { min-height: 120px; }
    .auth-dialog__signal span { width: 62px; height: 62px; border-radius: 20px; }
}

@media (max-height: 760px) and (min-width: 861px) {
    .auth-brand-panel, .auth-workspace { padding-top: 28px; padding-bottom: 28px; }
    .auth-brand-panel__content { padding: 46px 0; }
    .auth-brand-panel h1 { font-size: clamp(2.7rem, 4.6vw, 4.2rem); }
    .auth-card__index { margin-bottom: 24px; }
    .auth-card h2 { font-size: clamp(2rem, 3.5vw, 2.7rem); }
    .auth-card__intro { margin-bottom: 22px; }
    .auth-form { gap: 15px; }
    .auth-input { height: 49px; }
    .auth-button { min-height: 49px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}