:root {
    --bg: #f5f7fb;
    --surface: #ffffff;
    --surface-soft: #f8fafc;
    --ink: #172033;
    --muted: #667085;
    --line: #dce3ec;
    --line-strong: #c6d0dd;
    --green: #22c58b;
    --green-dark: #11835f;
    --teal: #14b8a6;
    --blue: #3157d5;
    --amber: #f59f18;
    --danger: #d92d20;
    --shadow: 0 12px 34px rgba(23, 32, 51, 0.10);
    --radius: 8px;
}

* {
    box-sizing: border-box;
}

[hidden] {
    display: none !important;
}

body {
    margin: 0;
    min-height: 100vh;
    color: var(--ink);
    background:
        linear-gradient(120deg, rgba(229, 249, 237, 0.82), rgba(246, 239, 255, 0.72)),
        var(--bg);
    font-family: Inter, Arial, Helvetica, sans-serif;
    letter-spacing: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
textarea,
select {
    font: inherit;
}

button {
    cursor: pointer;
}

.app-topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 72px;
    padding: 0 28px;
    border-bottom: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(14px);
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    color: #063d31;
    border: 1px solid rgba(34, 197, 139, 0.45);
    border-radius: var(--radius);
    background: linear-gradient(135deg, #dffbf1, #a7f3d0);
}

.brand strong,
.brand small {
    display: block;
}

.brand strong {
    font-size: 15px;
}

.brand small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
}

.top-actions,
.heading-actions,
.hero-actions,
.row-actions,
.library-actions,
.stage-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.app-main {
    width: min(1180px, calc(100% - 32px));
    margin: 28px auto 56px;
}

.dashboard-shell {
    display: grid;
    gap: 20px;
    margin-bottom: 24px;
}

.search-strip {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 52px minmax(220px, 320px);
    gap: 14px;
    align-items: center;
    padding: 12px;
    border: 1px solid rgba(255, 255, 255, 0.74);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 16px 38px rgba(23, 32, 51, 0.08);
}

.search-box {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 0 14px;
    color: #98a2b3;
    border-radius: var(--radius);
    background: #f4f6f8;
}

.search-box input {
    width: 100%;
    border: 0;
    outline: 0;
    color: var(--ink);
    background: transparent;
    font-size: 16px;
}

.notify {
    width: 52px;
    height: 52px;
    color: #7a3dd6;
    border: 0;
    background: #f3e8ff;
}

.profile-pill {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 52px;
    padding: 8px 12px;
    border-radius: var(--radius);
    background: #ffffff;
}

.avatar.mini {
    width: 36px;
    height: 36px;
    font-size: 12px;
}

.profile-pill strong,
.profile-pill small {
    display: block;
}

.profile-pill small {
    color: var(--muted);
    font-size: 12px;
}

.mock-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1.15fr 1fr;
    grid-template-areas:
        "manage manage chart valid"
        "tasks tasks chart progress"
        "kpi1 kpi2 account forms";
    gap: 12px;
}

.mock-card {
    min-height: 120px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.76);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.90);
    box-shadow: 0 18px 42px rgba(23, 32, 51, 0.09);
}

.management-card {
    grid-area: manage;
}

.task-card {
    grid-area: tasks;
}

.chart-card {
    grid-area: chart;
    min-height: 390px;
}

.money-card:nth-of-type(4) {
    grid-area: valid;
}

.money-card:nth-of-type(5) {
    grid-area: progress;
}

.money-card:nth-of-type(6) {
    grid-area: forms;
}

.mini-kpi:nth-of-type(7) {
    grid-area: kpi1;
}

.mini-kpi:nth-of-type(8) {
    grid-area: kpi2;
}

.account-card {
    grid-area: account;
}

.mock-card-head,
.chart-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}

.mock-card-head strong,
.metric-line span,
.task-line {
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.mock-card-head span {
    width: 5px;
    height: 22px;
    border-radius: 999px;
    background: #d7dde5;
}

.metric-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 46px 96px;
    gap: 12px;
    align-items: center;
    min-height: 42px;
    border-bottom: 1px solid #edf1f5;
}

.metric-line b {
    color: var(--green);
}

.mini-line,
.money-card i,
.mini-kpi i {
    display: block;
    height: 7px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--green), #7c3aed);
}

.mini-line.soft {
    opacity: 0.35;
}

.task-card {
    display: grid;
    gap: 12px;
}

.task-line {
    color: #4b5565;
    line-height: 1.35;
}

.task-line input {
    width: 18px;
    height: 18px;
    accent-color: var(--green);
}

.chart-head {
    margin-bottom: 20px;
}

.skeleton-title {
    width: 150px;
    height: 9px;
    border-radius: 999px;
    background: #e6ebf1;
}

.chart-area {
    position: relative;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 20px;
    align-items: end;
    height: 285px;
    padding: 34px 26px 30px;
    border-radius: var(--radius);
    background:
        repeating-linear-gradient(to bottom, transparent 0, transparent 62px, #edf1f5 63px),
        #ffffff;
}

.chart-area>span {
    align-self: end;
    min-height: 60px;
    border-radius: 999px 999px 0 0;
    background: linear-gradient(to top, #6d45c7 0 34%, #56d66f 34% 100%);
}

.chart-area svg {
    position: absolute;
    inset: 42px 26px 30px;
    width: calc(100% - 52px);
    height: calc(100% - 72px);
    pointer-events: none;
}

.chart-area path {
    fill: none;
    stroke-width: 5;
}

.chart-area path:first-child {
    stroke: #5b21b6;
}

.chart-area path:last-child {
    stroke: #22c55e;
}

.money-card,
.mini-kpi {
    display: grid;
    align-content: center;
    justify-items: center;
    text-align: center;
}

.money-card span,
.mini-kpi span {
    color: #7a3dd6;
    font-size: 13px;
    font-weight: 900;
}

.money-card strong {
    margin-top: 22px;
    color: #667085;
}

.money-card b,
.mini-kpi strong {
    margin-top: 10px;
    color: var(--green);
    font-size: 22px;
}

.money-card i,
.mini-kpi i {
    width: 70%;
    margin-top: 18px;
    opacity: 0.20;
}

.account-card h2 {
    margin: 0 0 14px;
    font-size: 20px;
}

.account-row {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    margin-top: 12px;
}

.account-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: var(--radius);
    color: #7a3dd6;
    font-weight: 900;
}

.account-icon.coral {
    background: #ff5d7a;
}

.account-icon.purple {
    background: #b990ff;
}

.account-row strong,
.account-row small {
    display: block;
}

.account-row strong {
    color: #6d28d9;
}

.account-row small {
    color: var(--muted);
    margin-top: 4px;
}

.dashboard-actions-row {
    margin-top: 6px;
}

.page-heading,
.process-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
}

.page-heading h1,
.process-hero h1 {
    margin: 4px 0 0;
    font-size: clamp(28px, 4vw, 42px);
    line-height: 1.05;
}

.process-hero p,
.panel-header p,
.page-heading p {
    margin: 5px 0 0;
    color: var(--muted);
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    color: var(--green-dark);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.back-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 12px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.button,
.icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    border: 1px solid transparent;
    border-radius: var(--radius);
    font-weight: 800;
    white-space: nowrap;
    cursor: pointer;
}

.button {
    padding: 0 16px;
}

.button.small {
    min-height: 34px;
    padding: 0 12px;
    font-size: 13px;
}

.button-primary {
    color: #ffffff;
    background: var(--ink);
    box-shadow: 0 8px 22px rgba(23, 32, 51, 0.16);
}

.button-primary:hover {
    background: #0f1726;
}

.button.is-disabled {
    background: #f2f4f7 !important;
    color: #98a2b3 !important;
    border-color: #e4e7ec !important;
    box-shadow: none !important;
}

.button-ghost {
    color: var(--ink);
    border-color: var(--line);
    background: var(--surface);
    margin: 16px;
}

.button-ghost:hover,
.icon-button:hover {
    border-color: var(--line-strong);
    background: #eef3f8;
}

.icon-button {
    width: 40px;
    height: 40px;
    padding: 0;
    color: var(--ink);
    border-color: var(--line);
    background: var(--surface);
}

.icon-button.danger {
    color: var(--danger);
}

.icon-button.is-success {
    color: var(--green-dark);
    border-color: #b7ebd6;
    background: #e8fbf3;
}

svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}

.stat-tile {
    min-height: 108px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
}

.stat-tile span {
    display: block;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.stat-tile strong {
    display: block;
    margin-top: 12px;
    font-size: 32px;
}

.stat-accent {
    color: #073d33;
    border-color: #b7ebd6;
    background: linear-gradient(135deg, #e7fff6, #eff6ff);
}

.dashboard-grid,
.process-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
    gap: 18px;
    align-items: start;
}

.process-grid {
    grid-template-columns: 360px minmax(0, 1fr);
}

.plan-usage-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 18px;
}

.plan-usage-strip article {
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
}

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

.plan-usage-strip span {
    color: var(--muted);
    font-size: 12px;
}

.plan-usage-strip strong {
    margin-top: 4px;
    font-size: 17px;
    font-weight: 650;
}

.usage-mini-list {
    display: grid;
    gap: 6px;
    margin: 12px 0;
}

.usage-mini-list small {
    color: var(--muted);
}

.archived-processes-block {
    margin-top: 14px;
    padding: 14px;
    border-top: 1px solid var(--line);
}

.archived-process-list {
    margin-top: 12px;
    padding: 0;
}

.process-row.is-archived {
    background: var(--surface-soft);
}

.tool-panel {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: 0 1px 0 rgba(23, 32, 51, 0.03);
}

.panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft);
}

.panel-header.compact {
    padding: 16px;
}

.panel-header h2 {
    margin: 0;
    font-size: 18px;
}

.panel-header p {
    font-size: 13px;
}

.process-list,
.form-library,
.stage-list,
.candidate-table,
.report-timeline {
    display: grid;
    gap: 10px;
    padding: 14px;
}

.process-row,
.library-item,
.stage-item,
.candidate-row {
    display: grid;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
}

.process-row {
    grid-template-columns: minmax(0, 1fr) auto;
}

.process-main {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.process-main strong,
.library-item strong,
.stage-item strong,
.candidate-person strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.process-main small,
.library-item small,
.stage-item small,
.candidate-person small,
.candidate-score small {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    color: var(--muted);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.status-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--green);
    box-shadow: 0 0 0 4px rgba(34, 197, 139, 0.14);
}

.status-pausada {
    background: var(--amber);
    box-shadow: 0 0 0 4px rgba(245, 159, 24, 0.16);
}

.status-encerrada {
    background: var(--muted);
    box-shadow: 0 0 0 4px rgba(102, 112, 133, 0.14);
}

.validation-chip,
.muted-chip,
.score-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.validation-chip {
    color: #064e3b;
    background: #dffbf1;
}

.muted-chip {
    color: var(--muted);
    background: #eef2f6;
}

.score-pill {
    color: #ffffff;
    background: var(--blue);
}

.library-item {
    grid-template-columns: minmax(0, 1fr) auto;
}

.library-actions form,
.row-actions form,
.stage-actions form {
    display: inline-flex;
}

.empty-state {
    display: grid;
    place-items: center;
    gap: 10px;
    min-height: 160px;
    padding: 22px;
    color: var(--muted);
    text-align: center;
}

.empty-state.small {
    min-height: 120px;
}

.empty-state svg,
.builder-empty svg,
.state-card>svg {
    width: 38px;
    height: 38px;
    color: var(--line-strong);
}

.ai-strip {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    margin-bottom: 18px;
    padding: 14px;
    border: 1px solid #b7ebd6;
    border-radius: var(--radius);
    background: linear-gradient(135deg, rgba(231, 255, 246, 0.95), rgba(239, 246, 255, 0.95));
}

.ai-strip p {
    margin: 0;
    color: #31505e;
    font-size: 14px;
    line-height: 1.45;
}

.ai-badge-large {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 14px;
    color: #063d31;
    border: 1px solid rgba(20, 184, 166, 0.28);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.68);
    box-shadow: 0 8px 22px rgba(20, 184, 166, 0.10);
    font-weight: 900;
}

.ai-badge-large.centered {
    justify-self: center;
}

.stage-item {
    grid-template-columns: 40px minmax(0, 1fr) auto;
}

.stage-order {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    color: #064e3b;
    border: 1px solid #b7ebd6;
    border-radius: var(--radius);
    background: #e8fbf3;
    font-weight: 900;
}

.candidate-row {
    grid-template-columns: minmax(220px, 1.2fr) minmax(160px, 0.7fr) minmax(120px, 0.45fr) auto;
}

.candidate-person {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    color: #ffffff;
    border-radius: var(--radius);
    background: linear-gradient(135deg, var(--blue), var(--teal));
    font-weight: 900;
}

.candidate-progress {
    display: grid;
    gap: 7px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.progress-bar {
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: #e6ebf1;
}

.progress-bar i {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--green), var(--blue));
}

.candidate-score {
    display: grid;
    gap: 4px;
    justify-items: start;
}

.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: rgba(8, 15, 30, 0.52);
}

.modal-backdrop.is-open {
    display: flex;
}

.modal-card {
    width: min(720px, 100%);
    max-height: min(92vh, 900px);
    overflow: hidden;
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: var(--shadow);
    display: flex;
    flex-direction: column;
}

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

.compact-modal {
    width: min(420px, 100%);
}

.modal-card form {
    display: flex;
    max-height: inherit;
    flex-direction: column;
    overflow: hidden;
    flex: 1;
}

.modal-header,
.modal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft);
}

.modal-footer {
    justify-content: flex-end;
    border-top: 1px solid var(--line);
    border-bottom: 0;
}

.modal-header h3 {
    margin: 0;
    font-size: 18px;
}

.modal-body {
    display: grid;
    gap: 14px;
    padding: 18px;
    overflow: auto;
}

.field-grid {
    display: grid;
    gap: 12px;
}

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

.field-grid.three {
    grid-template-columns: 1.2fr 0.7fr 1fr;
}

.field {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.field span,
.choice-box legend {
    color: #344054;
    font-size: 12px;
    font-weight: 800;
}

.field input,
.field textarea,
.field select {
    width: 100%;
    min-height: 42px;
    padding: 10px 12px;
    color: var(--ink);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius);
    outline: none;
    background: #ffffff;
}

.field textarea {
    resize: vertical;
}

.field input:focus,
.field textarea:focus,
.field select:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(49, 87, 213, 0.12);
}

.switch-line {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #344054;
    font-size: 13px;
    font-weight: 700;
}

.switch-line input,
.choice-line input {
    width: 18px;
    height: 18px;
    accent-color: var(--green);
}

.builder-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 4px;
}

.fields-builder,
.dynamic-fields {
    display: grid;
    gap: 12px;
}

.builder-field {
    display: grid;
    gap: 12px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface-soft);
}

.builder-field-grid {
    display: grid;
    grid-template-columns: minmax(120px, 0.7fr) minmax(180px, 1fr) minmax(150px, 0.7fr) 90px 120px 42px;
    gap: 10px;
    align-items: end;
}

.builder-required {
    min-height: 42px;
}

.builder-empty {
    display: grid;
    place-items: center;
    gap: 10px;
    min-height: 120px;
    padding: 20px;
    color: var(--muted);
    border: 1px dashed var(--line-strong);
    border-radius: var(--radius);
    background: var(--surface-soft);
    text-align: center;
}

.choice-box {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.choice-line {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 36px;
    padding: 6px 8px;
    border-radius: var(--radius);
    color: var(--ink);
    font-size: 14px;
    font-weight: 650;
}

.choice-line:hover {
    background: #f0f6f7;
}

.section-label {
    margin: 12px 0 0;
    color: var(--green-dark);
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
}

.toast {
    position: fixed;
    right: 22px;
    top: 86px;
    z-index: 120;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    max-width: min(420px, calc(100% - 32px));
    padding: 12px 14px;
    color: #064e3b;
    border: 1px solid #b7ebd6;
    border-radius: var(--radius);
    background: #e8fbf3;
    box-shadow: var(--shadow);
    font-weight: 800;
}

.toast-error {
    color: #7a271a;
    border-color: #fecdc9;
    background: #ffebe9;
}

.public-shell {
    color: #eef7f6;
    background:
        linear-gradient(115deg, rgba(9, 18, 33, 0.92), rgba(14, 53, 53, 0.86)),
        linear-gradient(90deg, #0b1220, #143b3a);
}

.public-main {
    width: min(980px, calc(100% - 28px));
    margin: 0 auto;
    padding: 18px 0 42px;
}

.public-frame {
    min-height: calc(100vh - 60px);
}

.public-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 62px;
}

.public-brand strong,
.public-brand small {
    color: #ffffff;
}

.public-icons {
    display: inline-flex;
    gap: 16px;
    color: #ffffff;
}

body.public-shell {
    background: #ffffff;
}

.public-card {
    margin: 22px auto 0;
    padding: clamp(18px, 4vw, 32px);
    color: var(--ink);
    border: none;
    border-radius: var(--radius);
    background: #ffffff;
    box-shadow: none;
}

.state-card {
    display: grid;
    place-items: center;
    gap: 12px;
    min-height: 380px;
    text-align: center;
}

.state-card h1 {
    margin: 0;
    font-size: clamp(30px, 5vw, 48px);
}

.state-card p {
    max-width: 520px;
    margin: 0;
    color: var(--muted);
    line-height: 1.5;
}

.candidate-strip {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: start;
    margin-bottom: 18px;
}

.candidate-strip h1 {
    margin: 4px 0;
    font-size: clamp(28px, 4vw, 44px);
}

.candidate-strip p {
    margin: 0;
    color: var(--muted);
}

.public-progress {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    margin: 18px 0;
    color: var(--muted);
    font-size: 13px;
    font-weight: 900;
}

.stage-title {
    display: grid;
    gap: 4px;
    margin: 20px 0;
}

.stage-title span {
    color: var(--green-dark);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.stage-title strong {
    font-size: 22px;
}

.public-field {
    margin-bottom: 14px;
}

.public-submit {
    display: flex;
    justify-content: flex-end;
    margin-top: 18px;
}

.info-panel {
    display: grid;
    gap: 6px;
    padding: 14px;
    color: #31505e;
    border: 1px solid #d5e5ef;
    border-radius: var(--radius);
    background: #f8fbfd;
}

.qr-body {
    justify-items: center;
    text-align: center;
}

.qr-body img {
    width: 280px;
    max-width: 100%;
    aspect-ratio: 1;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #ffffff;
}

.qr-body p {
    max-width: 100%;
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.info-panel strong {
    color: var(--ink);
}

.disc-intro {
    display: grid;
    gap: 14px;
    justify-items: start;
}

.disc-flow {
    display: grid;
    gap: 18px;
}

.disc-topline {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    color: var(--muted);
    font-size: 13px;
    font-weight: 900;
}

.disc-slide {
    display: none;
}

.disc-slide.is-active {
    display: block;
}

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

.disc-columns h3 {
    margin: 0 0 10px;
    font-size: 16px;
}

.disc-option {
    border: 1px solid var(--line);
    background: #ffffff;
}

.disc-actions {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.disc-actions .button[disabled] {
    cursor: not-allowed;
    opacity: 0.45;
}

.report-summary {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr) 240px;
    gap: 14px;
    margin-bottom: 18px;
}

.summary-score,
.summary-copy,
.summary-contact {
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
}

.summary-score span,
.summary-contact span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.summary-score strong {
    display: block;
    margin: 10px 0 4px;
    font-size: 36px;
}

.summary-contact strong,
.summary-contact small {
    display: block;
    margin-top: 8px;
}

.summary-contact small {
    color: var(--muted);
}

.summary-copy {
    display: grid;
    gap: 12px;
}

.summary-copy p {
    margin: 0;
    color: #344054;
    line-height: 1.5;
}

.report-step {
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.report-step-head {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
}

.report-step-head strong,
.report-step-head small {
    display: block;
}

.report-step-head small,
.muted-text {
    color: var(--muted);
    font-size: 13px;
}

.analysis-box {
    margin-top: 14px;
    padding: 12px;
    border: 1px solid #d5e5ef;
    border-radius: var(--radius);
    background: #f8fbfd;
}

.analysis-box p {
    margin: 6px 0 0;
    color: #344054;
    line-height: 1.45;
}

.report-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.report-badges span {
    padding: 5px 9px;
    color: #064e3b;
    border-radius: 999px;
    background: #dffbf1;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.answer-list {
    display: grid;
    gap: 10px;
    margin: 14px 0 0;
}

.answer-list div {
    display: grid;
    gap: 4px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line);
}

.answer-list dt {
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
}

.answer-list dd {
    margin: 0;
    line-height: 1.45;
}

.disc-report {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.disc-report span {
    padding: 8px 10px;
    border-radius: var(--radius);
    background: #eef3f8;
}

@media (max-width: 1040px) {

    .stats-grid,
    .dashboard-grid,
    .process-grid,
    .report-summary {
        grid-template-columns: 1fr 1fr;
    }

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

    .mock-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "manage chart"
            "tasks chart"
            "valid progress"
            "kpi1 kpi2"
            "account forms";
    }

    .candidate-row {
        grid-template-columns: minmax(0, 1fr) minmax(140px, 0.5fr);
    }

    .row-actions {
        grid-column: 1 / -1;
        justify-content: flex-end;
    }

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

@media (max-width: 760px) {

    .app-topbar,
    .page-heading,
    .process-hero,
    .candidate-strip,
    .ai-strip {
        align-items: stretch;
        flex-direction: column;
        grid-template-columns: 1fr;
    }

    .app-topbar {
        height: auto;
        padding: 14px 16px;
    }

    .app-main,
    .public-main {
        width: min(100% - 20px, 680px);
        min-width: 0;
        margin-top: 18px;
    }

    .search-strip,
    .plan-usage-strip,
    .mock-grid {
        grid-template-columns: 1fr;
    }

    .mock-grid {
        grid-template-areas:
            "manage"
            "tasks"
            "chart"
            "valid"
            "progress"
            "forms"
            "kpi1"
            "kpi2"
            "account";
    }

    .chart-card {
        min-height: 320px;
    }

    .chart-area {
        height: 220px;
        gap: 12px;
        padding-inline: 14px;
    }

    .stats-grid,
    .dashboard-grid,
    .field-grid.two,
    .field-grid.three,
    .report-summary,
    .disc-columns {
        grid-template-columns: 1fr;
    }

    .process-row,
    .library-item,
    .stage-item,
    .candidate-row,
    .report-step-head {
        grid-template-columns: 1fr;
    }

    .process-meta,
    .stage-actions,
    .library-actions,
    .row-actions,
    .heading-actions,
    .hero-actions,
    .public-submit {
        justify-content: stretch;
    }

    .button,
    .heading-actions .button,
    .hero-actions .button,
    .public-submit .button {
        width: 100%;
    }

    .icon-button {
        flex: 0 0 40px;
    }

    .builder-field-grid {
        grid-template-columns: 1fr;
    }

    .candidate-progress,
    .candidate-score {
        justify-items: stretch;
    }

    .modal-backdrop {
        padding: 10px;
    }

    .modal-card {
        max-height: 95vh;
    }

    .toast {
        top: 12px;
        right: 10px;
        left: 10px;
    }
}

body {
    background: #ffffff;
}

.app-main {
    width: min(1600px, calc(100% - 40px));
    max-width: none;
}

@media (min-width: 1480px) {
    .app-main {
        min-width: 1400px;
    }
}

.app-topbar {
    background: rgba(255, 255, 255, 0.96);
}

.icon-button,
.text-icon-button,
.drag-handle {
    width: 38px;
    height: 38px;
    min-height: 38px;
    padding: 0;
    color: #1a73e8;
    border: 0;
    border-radius: 999px;
    background: transparent;
    box-shadow: none;
}

.icon-button:hover,
.text-icon-button:hover,
.drag-handle:hover {
    background: #eef3fe;
}

.icon-button.danger,
.text-icon-button.danger {
    color: #ea4335;
}

.text-icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.process-page-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.process-page-head h1 {
    margin: 4px 0 0;
    font-size: 28px;
    line-height: 1.15;
}

.process-page-head p {
    margin: 6px 0 0;
    color: #5f6368;
}

.process-workspace {
    display: grid;
    grid-template-columns: 340px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.panel-card {
    overflow: hidden;
    border: 1px solid #dadce0;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(60, 64, 67, 0.18);
}

.section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 56px;
    padding: 14px 18px;
    border-bottom: 1px solid #e8eaed;
}

.section-head strong,
.section-head span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.section-head strong {
    font-size: 16px;
}

.section-head span {
    color: #475467;
    font-size: 12px;
}

.stage-stack {
    display: grid;
    gap: 10px;
    padding: 14px;
}

.process-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
    border-bottom: 1px solid #e0e3e7;
    padding: 10px;
    overflow-x: auto;
}

.process-tabs button {
    background: none;
    border: none;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 500;
    color: #475467;
    cursor: pointer;
    border-radius: 6px;
    transition: all 0.2s ease;
}

.process-tabs button:hover {
    background-color: #f0f2f5;
    color: #1a1a1a;
}

.process-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.process-meta>.icon-button:hover,
.process-meta .status-dropdown>.icon-button:hover {
    background-color: #f3f4f6;
    color: #1a1a1a;
}

.status-dropdown {
    position: relative;
    display: flex;
    align-items: center;
}

.status-dropdown-menu {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    width: 140px;
    background: #ffffff;
    border: 1px solid #e0e3e7;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(60, 64, 67, 0.1);
    padding: 6px;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.status-dropdown-menu[hidden] {
    display: none;
}

.status-menu-item {
    display: flex;
    width: 100%;
    align-items: center;
    padding: 8px 12px;
    border: none;
    background: transparent;
    border-radius: 4px;
    font-size: 13px;
    color: #1a1a1a;
    cursor: pointer;
    text-align: left;
    transition: background-color 0.15s;
}

.status-menu-item:hover:not(:disabled) {
    background: #f3f4f6;
}

.status-menu-item:disabled {
    color: #a0aab8;
    cursor: not-allowed;
    background: #f8fafc;
}

.archived-processes-block {
    display: none;
}

.process-tabs button.is-active {
    background-color: var(--primary-light, #eaf2ff);
    color: var(--primary-dark, #2b5bc1);
}

.process-tab-content {
    display: none;
}

.process-tab-content.is-active {
    display: block;
}

.stage-card {
    display: grid;
    grid-template-columns: 22px 32px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    padding: 14px 12px;
    border: 1px solid #e0e3e7;
    border-radius: 8px;
    background: #ffffff;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.stage-card:hover {
    border-color: #c8d7f4;
    box-shadow: 0 2px 8px rgba(60, 64, 67, 0.12);
}

.stage-card.is-dragging,
.builder-section.is-dragging,
.builder-field.is-dragging {
    opacity: 0.62;
}

.stage-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    color: #1967d2;
    border-radius: 999px;
    background: #e8f0fe;
    font-weight: 800;
}

.stage-card-body {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.stage-title-row,
.inline-actions,
.candidate-actions,
.sheet-stage-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.stage-title-row {
    justify-content: space-between;
}

.stage-title-row strong {
    min-width: 0;
    overflow: hidden;
    font-size: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stage-card p,
.stage-card small {
    margin: 0;
    color: #475467;
    font-size: 12px;
    line-height: 1.35;
}

.stage-form-name {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #188038;
    font-size: 12px;
    font-weight: 800;
}

.stage-config-warning {
    align-items: center;
    color: #b45309;
    display: flex;
    font-size: 12px;
    gap: 5px;
    line-height: 1.35;
    margin-top: 6px;
}

.stage-config-warning svg {
    flex: 0 0 auto;
    height: 14px;
    width: 14px;
}

.stage-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 2px;
    color: #5f6368;
    font-size: 12px;
}

.soft-action,
.link-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 30px;
    padding: 0 9px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    font-size: 12px;
    font-weight: 800;
}

.soft-action.green {
    color: #188038;
    background: #e6f4ea;
}

.soft-action.purple {
    color: #a142f4;
    background: #f3e8fd;
}

.link-action {
    color: #1a73e8;
}

.link-action:hover {
    background: #eef3fe;
}

.candidate-table-modern {
    display: grid;
}

.candidate-header-row,
.candidate-data-row {
    display: grid;
    grid-template-columns: 64px minmax(260px, 1.3fr) 120px 90px 150px minmax(220px, auto);
    gap: 12px;
    align-items: center;
    padding: 14px 18px;
}

.candidate-header-row {
    min-height: 52px;
    color: #3c4043;
    border-bottom: 1px solid #e8eaed;
    font-size: 13px;
    font-weight: 800;
}

.candidate-data-row {
    min-height: 70px;
    border-bottom: 1px solid #edf0f2;
    background: #fff;
}

.candidate-data-row:last-child {
    border-bottom: 0;
}

.candidate-data-row:hover {
    background: #f8fbff;
}

.rank,
.stage-count b,
.candidate-open strong {
    font-weight: 900;
}

.candidate-open {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
}

.candidate-open small,
.stage-count small {
    display: block;
    overflow: hidden;
    color: #475467;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stage-count {
    display: grid;
    gap: 3px;
}

.candidate-actions {
    justify-content: flex-end;
}

.candidate-actions form {
    display: inline-flex;
}

.status-pill,
.status-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: max-content;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    color: #8a5a00;
    background: #fff4d8;
    font-size: 12px;
    font-weight: 900;
}

.status-novo {
    color: #475467;
    background: #eef2f6;
}

.status-finalizado,
.status-aprovado {
    color: #137333;
    background: #e6f4ea;
}

.status-reprovado,
.status-revisar {
    color: #b3261e;
    background: #fce8e6;
}

.side-sheet-backdrop {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: none;
    background: rgba(32, 33, 36, 0.44);
}

.side-sheet-backdrop.is-open {
    display: block;
}

.side-sheet-backdrop.recessed {
    display: none !important;
}

.candidate-sheet-panel {
    position: absolute;
    top: 0;
    right: 0;
    display: grid;
    align-content: start;
    gap: 16px;
    width: min(680px, 100%);
    min-height: 100vh;
    padding: 0 24px 24px;
    background: #ffffff;
    box-shadow: -8px 0 24px rgba(60, 64, 67, 0.18);
}

.candidate-sheet-panel>header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 14px;
    margin: 0 -24px;
    padding: 18px 24px 16px;
    border-bottom: 1px solid #e8eaed;
}

.candidate-sheet-panel h2 {
    margin: 0;
    color: #1a73e8;
    font-size: 20px;
}

.candidate-sheet-panel p {
    margin: 5px 0 0;
    color: #475467;
    font-size: 13px;
}

.sheet-kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.sheet-kpis article {
    display: grid;
    gap: 7px;
    min-height: 68px;
    padding: 13px;
    border: 1px solid #dadce0;
    border-radius: 8px;
    background: #ffffff;
}

.sheet-kpis span,
.sheet-stage-main small,
.sheet-stage-side small {
    color: #5f6368;
    font-size: 12px;
    font-weight: 700;
}

.sheet-kpis strong {
    font-size: 16px;
}

.sheet-actions {
    display: flex;
    justify-content: flex-end;
}

.sheet-stage-list {
    display: grid;
    gap: 12px;
}

.sheet-stage-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: start;
    padding: 16px;
    border: 1px solid #dadce0;
    border-radius: 8px;
    background: #ffffff;
}

.sheet-stage-main {
    display: grid;
    gap: 6px;
}

.sheet-stage-main span {
    font-size: 17px;
    font-weight: 900;
}

.sheet-stage-side {
    display: grid;
    justify-items: end;
    gap: 8px;
}

.section-builder {
    gap: 14px;
}

.builder-section {
    display: grid;
    gap: 10px;
    padding: 12px;
    border: 1px solid #dadce0;
    border-radius: 8px;
    background: #ffffff;
}

.builder-section-head {
    display: grid;
    grid-template-columns: 28px minmax(220px, 1fr) auto 34px;
    gap: 10px;
    align-items: end;
}

.section-name-field span {
    color: #188038;
}

.builder-section-fields {
    display: grid;
    gap: 10px;
    min-height: 24px;
}

.builder-field {
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: start;
    background: #f8fafc;
}

.builder-field-grid {
    grid-template-columns: minmax(240px, 1fr) minmax(180px, 240px) 126px 34px;
    align-items: end;
}

.builder-empty.small {
    min-height: 68px;
    padding: 12px;
}

.disc-preview {
    display: grid;
    gap: 10px;
}

.disc-preview article {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 12px;
    border: 1px solid #e0e3e7;
    border-radius: 8px;
}

.disc-preview strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    color: #1967d2;
    background: #e8f0fe;
}

.disc-preview div {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.disc-preview span {
    padding: 7px 9px;
    border-radius: 999px;
    background: #f1f3f4;
    font-size: 13px;
    font-weight: 700;
}

.disc-preview small {
    color: #188038;
    font-weight: 900;
}

@media (max-width: 1180px) {
    .process-workspace {
        grid-template-columns: 1fr;
    }

    .candidate-table-modern {
        overflow-x: auto;
    }

    .candidate-header-row,
    .candidate-data-row {
        min-width: 980px;
    }
}

@media (max-width: 760px) {
    .app-main {
        min-width: 0;
        width: min(100% - 20px, 680px);
    }

    .process-page-head {
        align-items: stretch;
        flex-direction: column;
    }

    .sheet-kpis,
    .sheet-stage-card,
    .builder-section-head,
    .builder-field-grid {
        grid-template-columns: 1fr;
    }

    .candidate-sheet-panel {
        padding-inline: 16px;
    }

    .candidate-sheet-panel>header {
        margin-inline: -16px;
        padding-inline: 16px;
    }

    .sheet-actions,
    .sheet-stage-side {
        justify-items: stretch;
    }
}

.button,
.soft-action,
.link-action,
.validation-chip,
.muted-chip,
.score-pill {
    font-weight: 600;
}

.button-primary {
    color: #ffffff;
    background: #1a73e8;
    box-shadow: 0 4px 12px rgba(26, 115, 232, 0.18);
}

.button-primary:hover {
    background: #1765cc;
}

.button-ghost {
    color: #1967d2;
    border-color: #d2e3fc;
    background: #f8fbff;
}

.button-ghost:hover {
    border-color: #aecbfa;
    background: #eef3fe;
}

.process-workspace {
    grid-template-columns: 370px minmax(0, 1fr);
}

.section-head strong {
    font-weight: 650;
}

.stage-stack {
    gap: 12px;
    padding: 16px;
}

.stage-card {
    grid-template-columns: 20px 30px minmax(0, 1fr);
    gap: 10px;
    padding: 16px 12px;
}

.stage-drag-handle {
    width: 22px;
    height: 32px;
}

.stage-number {
    width: 28px;
    height: 28px;
    font-weight: 650;
}

.stage-title-row {
    align-items: flex-start;
    gap: 8px;
}

.stage-title-row strong {
    white-space: normal;
    overflow-wrap: anywhere;
    font-size: 17px;
    font-weight: 650;
    line-height: 1.25;
}

.inline-actions {
    flex: 0 0 auto;
    gap: 2px;
}

.stage-card .text-icon-button {
    width: 30px;
    height: 30px;
    min-height: 30px;
}

.stage-card-body {
    gap: 9px;
}

.stage-meta-line,
.stage-card small {
    overflow-wrap: anywhere;
}

.stage-card p,
.stage-card small {
    font-size: 12.5px;
    line-height: 1.45;
}

.stage-form-name {
    align-items: flex-start;
    max-width: 100%;
    color: #188038;
    font-weight: 650;
    line-height: 1.35;
    overflow-wrap: anywhere;
    white-space: normal;
}

.stage-form-name svg {
    margin-top: 1px;
}

.stage-card-footer {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: start;
    gap: 8px;
    margin-top: 4px;
}

.stage-response-count {
    color: #475467;
}

.soft-action {
    max-width: 100%;
    min-height: 32px;
    padding: 0 10px;
    border-radius: 6px;
    line-height: 1.1;
    white-space: normal;
}

.soft-action.green {
    color: #137333;
    background: #e6f4ea;
}

.soft-action.purple {
    color: #9334e6;
    background: #f3e8fd;
}

.candidate-header-row {
    font-weight: 650;
}

.rank,
.stage-count b,
.candidate-open strong,
.status-pill,
.status-chip,
.sheet-stage-main span {
    font-weight: 650;
}

.sheet-kpis strong {
    font-weight: 650;
}

.disc-model-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px;
    gap: 10px;
    align-items: end;
}

.disc-model-preview {
    margin-bottom: 2px;
}

.disc-option {
    transition: border-color 0.16s ease, background-color 0.16s ease, color 0.16s ease;
}

.disc-option.is-conflict {
    border-color: #ea4335;
    background: #fce8e6;
    color: #b3261e;
}

.disc-option.is-missing {
    border-color: #f4b4ae;
    background: #fff7f6;
}

.disc-option.is-conflict input {
    accent-color: #ea4335;
}

.disc-preview-modal {
    width: min(920px, 100%);
}

.disc-preview-modal .modal-body {
    gap: 14px;
    padding: 16px;
}

.disc-preview-intro {
    display: grid;
    gap: 5px;
    padding: 14px;
    border: 1px solid #d2e3fc;
    border-radius: 8px;
    background: #f8fbff;
}

.disc-preview-intro strong {
    color: #3c4043;
    font-weight: 650;
    line-height: 1.35;
}

.disc-preview-intro span {
    color: #475467;
    line-height: 1.35;
}

.disc-preview {
    gap: 10px;
}

.disc-preview .disc-preview-question {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 14px;
    border: 1px solid #e0e3e7;
    border-radius: 8px;
    background: #ffffff;
}

.disc-preview-question h4 {
    margin: 0;
    color: #202124;
    font-size: 15px;
    font-weight: 650;
}

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

.disc-preview-columns>div {
    display: grid;
    gap: 9px;
}

.disc-preview-columns strong {
    display: block;
    width: auto;
    height: auto;
    padding: 0;
    border-radius: 0;
    background: transparent;
    font-size: 12px;
    font-weight: 700;
}

.disc-column-more {
    color: #188038;
}

.disc-column-less {
    color: #ea4335;
}

.disc-preview-columns span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: #3c4043;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.25;
}

.disc-preview-columns i {
    width: 11px;
    height: 11px;
    border: 1.5px solid #5f6368;
    border-radius: 999px;
}

@media (max-width: 1180px) {
    .process-workspace {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {

    .disc-preview-columns,
    .disc-model-row {
        grid-template-columns: 1fr;
    }

    .disc-model-preview {
        justify-self: start;
        margin-bottom: 0;
    }
}

.main-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 0;
    flex: 1 1 auto;
}

.main-nav a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 11px;
    color: #475467;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 600;
}

.main-nav a:hover,
.main-nav a.is-active {
    color: #1967d2;
    background: #eef3fe;
}

.topbar-account {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.profile-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    overflow: hidden;
    border: 1px solid #d2e3fc;
    border-radius: 999px;
    background: #f8fbff;
}

.profile-trigger img,
.profile-avatar-large img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.profile-trigger span,
.profile-avatar-large span {
    color: #1967d2;
    font-weight: 700;
}

.profile-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 92;
    display: none;
    background: rgba(32, 33, 36, 0.28);
}

.profile-drawer-backdrop.is-open {
    display: block;
}

.profile-drawer-panel {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    width: min(380px, 100%);
    min-height: 100vh;
    padding: 14px;
    background: #ffffff;
    box-shadow: -8px 0 24px rgba(60, 64, 67, 0.18);
}

.profile-drawer-panel>header {
    display: flex;
    justify-content: flex-end;
}

.profile-card {
    display: grid;
    justify-items: center;
    gap: 8px;
    padding: 14px 8px 22px;
    text-align: center;
}

.profile-avatar-large {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 78px;
    height: 78px;
    overflow: hidden;
    border-radius: 999px;
    background: #e8f0fe;
}

.profile-card h2 {
    margin: 6px 0 0;
    font-size: 20px;
}

.profile-card p {
    margin: 0;
    color: #667085;
    font-size: 13px;
}

.profile-card>span {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 10px;
    border-radius: 999px;
    color: #137333;
    background: #e6f4ea;
    font-size: 12px;
    font-weight: 650;
}

.profile-menu {
    display: grid;
    gap: 6px;
    margin-top: auto;
}

.profile-menu a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 0 12px;
    border-radius: 8px;
    color: #344054;
    font-weight: 600;
}

.profile-menu a:hover {
    background: #f1f5f9;
}

.profile-logout {
    margin-top: 18px;
    color: var(--danger) !important;
    background: #fff5f5;
}

.app-footer {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    width: min(1600px, calc(100% - 40px));
    margin: -28px auto 28px;
    color: #667085;
    font-size: 12px;
}

.login-shell {
    min-height: 100vh;
    background: #ffffff;
}

.login-main {
    width: min(1120px, calc(100% - 32px));
    margin: 0 auto;
    min-height: 100vh;
    display: grid;
    place-items: center;
}

.login-shell-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(360px, 0.7fr);
    gap: 28px;
    align-items: center;
    width: 100%;
}

.login-brand-panel,
.login-card {
    border: 1px solid #e0e3e7;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(60, 64, 67, 0.10);
}

.login-brand-panel {
    display: grid;
    align-content: space-between;
    gap: 34px;
    min-height: 520px;
    padding: 30px;
    background: linear-gradient(135deg, #f8fbff, #ffffff);
}

.login-brand-panel h1 {
    max-width: 680px;
    margin: 10px 0;
    font-size: clamp(34px, 4vw, 54px);
    line-height: 1.02;
}

.login-brand-panel p,
.login-card p {
    color: #475467;
    line-height: 1.5;
}

.login-value-list {
    display: grid;
    gap: 10px;
}

.login-value-list span {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #344054;
    font-weight: 600;
}

.login-card {
    display: grid;
    gap: 18px;
    padding: 24px;
}

.login-card h2 {
    margin: 6px 0 0;
    font-size: 28px;
}

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

.google-button {
    justify-content: center;
}

.login-separator {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #98a2b3;
    font-size: 12px;
    font-weight: 700;
}

.login-separator::before,
.login-separator::after {
    content: "";
    height: 1px;
    flex: 1;
    background: #e0e3e7;
}

.dashboard-welcome,
.product-direction {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
}

.dashboard-welcome h1,
.product-direction h2 {
    margin: 4px 0 0;
    font-size: clamp(28px, 4vw, 42px);
    line-height: 1.08;
}

.dashboard-welcome p,
.product-direction p {
    max-width: 760px;
    color: #667085;
    line-height: 1.5;
}

.saas-dashboard-grid,
.admin-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
    gap: 18px;
    align-items: start;
    margin-bottom: 22px;
}

.quick-action-list,
.product-checklist,
.user-list {
    display: grid;
    gap: 10px;
    padding: 14px;
}

.quick-action-list a {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid #e0e3e7;
    border-radius: 8px;
}

.quick-action-list a:hover {
    border-color: #aecbfa;
    background: #f8fbff;
}

.quick-action-list i {
    width: 42px;
    height: 42px;
    padding: 10px;
    color: #1967d2;
    border-radius: 999px;
    background: #e8f0fe;
}

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

.quick-action-list small {
    margin-top: 3px;
    color: #667085;
}

.subscription-summary,
.affiliate-placeholder {
    display: grid;
    gap: 10px;
    padding: 18px;
}

.subscription-summary span {
    color: #667085;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.subscription-summary strong {
    color: #1967d2;
    font-size: 28px;
}

.subscription-summary p,
.affiliate-placeholder p {
    margin: 0;
    color: #667085;
    line-height: 1.45;
}

.direction-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    min-width: min(620px, 100%);
}

.direction-grid article,
.admin-summary-grid article {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid #e0e3e7;
    border-radius: 8px;
    background: #fff;
}

.direction-grid i {
    color: #1967d2;
}

.direction-grid span,
.admin-summary-grid small {
    color: #667085;
    font-size: 13px;
}

.admin-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.admin-summary-grid span {
    color: #667085;
    font-size: 12px;
    font-weight: 700;
}

.admin-summary-grid strong {
    font-size: 22px;
}

.panel-form {
    display: grid;
    gap: 14px;
    padding: 54px 16px 16px 16px;
}

.form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.product-checklist span {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 38px;
    color: #344054;
    font-weight: 600;
}

.product-checklist i {
    color: #188038;
}

.plans-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 20px;
}

.plan-card {
    display: grid;
    gap: 14px;
    padding: 18px;
    border: 1px solid #e0e3e7;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(60, 64, 67, 0.10);
}

.plan-card.is-highlight {
    border-color: #aecbfa;
    box-shadow: 0 8px 24px rgba(26, 115, 232, 0.12);
}

.plan-card span {
    color: #1967d2;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.plan-card h2 {
    margin: 4px 0;
}

.plan-card p,
.plan-card small {
    color: #667085;
    line-height: 1.45;
}

.plan-card>strong {
    font-size: 30px;
}

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

.plan-card li {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #344054;
    font-size: 14px;
}

.plan-card li i {
    color: #188038;
}

.affiliate-placeholder {
    place-items: center;
    min-height: 260px;
    text-align: center;
}

.affiliate-placeholder>i {
    width: 48px;
    height: 48px;
    color: #1967d2;
}

.affiliate-placeholder span {
    color: #1967d2;
    font-weight: 700;
}

.user-row {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) 120px 110px minmax(220px, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid #e0e3e7;
    border-radius: 8px;
    background: #fff;
}

.user-identity {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.user-identity strong,
.user-identity small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-identity small,
.permission-preview {
    color: #667085;
    font-size: 12px;
}

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

.permission-matrix section {
    display: grid;
    gap: 8px;
    padding: 12px;
    border: 1px solid #e0e3e7;
    border-radius: 8px;
}

.permission-matrix strong {
    color: #1967d2;
}

@media (max-width: 1120px) {
    .app-topbar {
        align-items: stretch;
        flex-direction: row;
        height: auto;
        flex-wrap: wrap;
        padding: 12px 16px;
    }

    .main-nav {
        order: 3;
        flex-basis: 100%;
        justify-content: flex-start;
        overflow-x: auto;
        padding-top: 8px;
    }

    .plans-grid,
    .admin-summary-grid,
    .direction-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .user-row {
        grid-template-columns: minmax(0, 1fr) auto auto;
    }

    .permission-preview,
    .user-row .row-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 760px) {

    .login-shell-grid,
    .saas-dashboard-grid,
    .admin-grid,
    .plans-grid,
    .admin-summary-grid,
    .direction-grid,
    .permission-matrix {
        grid-template-columns: 1fr;
    }

    .login-main {
        min-height: auto;
        padding: 18px 0;
    }

    .login-brand-panel {
        min-height: auto;
    }

    .dashboard-welcome,
    .product-direction {
        align-items: stretch;
        flex-direction: column;
    }

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

    .app-footer {
        flex-direction: column;
        width: min(100% - 20px, 680px);
    }
}

/* Dark SaaS theme inspired by the latest visual reference. */
:root {
    --bg: #12051f;
    --surface: #241633;
    --surface-soft: #2d1f3f;
    --surface-strong: #38284b;
    --ink: #f7f3ff;
    --muted: #b7a9c9;
    --line: rgba(255, 255, 255, 0.12);
    --line-strong: rgba(255, 255, 255, 0.20);
    --green: #00e68a;
    --green-dark: #00bf73;
    --teal: #26e7bd;
    --blue: #8c6dff;
    --amber: #ffd166;
    --danger: #ff5c70;
    --shadow: 0 18px 42px rgba(0, 0, 0, 0.30);
}

body,
.login-shell {
    color: var(--ink);
    background: var(--bg);
}

.app-topbar {
    border-bottom-color: rgba(255, 255, 255, 0.08);
    background: rgba(18, 5, 31, 0.94);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

.app-main {
    width: min(1600px, calc(100% - 40px));
}

@media (min-width: 1480px) {
    .app-main {
        min-width: 1400px;
    }
}

.brand-mark {
    color: #07150f;
    border: 0;
    border-radius: 999px;
    background: var(--green);
    box-shadow: 0 0 0 6px rgba(0, 230, 138, 0.10);
}

.brand small,
.page-heading p,
.dashboard-welcome p,
.panel-header p,
.login-card p,
.login-brand-panel p,
.subscription-summary p,
.product-direction p,
.stage-card small,
.candidate-open small,
.profile-card p,
.app-footer,
.field span,
.user-identity small,
.permission-preview,
.plan-card p,
.plan-card small,
.admin-plan-list small,
.buyer-list small {
    color: var(--muted);
}

.main-nav a {
    color: #d6cbe7;
    font-weight: 500;
}

.main-nav a:hover,
.main-nav a.is-active {
    color: #07150f;
    background: var(--green);
}

.profile-trigger {
    border: 1px solid var(--line);
    background: var(--surface-soft);
}

.profile-trigger span,
.profile-avatar-large span {
    color: var(--green);
}

.tool-panel,
.panel-card,
.stat-tile,
.process-row,
.library-item,
.stage-card,
.candidate-data-row,
.modal-card,
.login-card,
.login-brand-panel,
.plan-card,
.user-row,
.permission-matrix section,
.admin-summary-grid article,
.product-direction,
.direction-grid article,
.profile-drawer-panel,
.side-sheet-backdrop .candidate-sheet-panel,
.plan-lock-banner {
    color: var(--ink);
    border-color: var(--line);
    background: var(--surface);
    box-shadow: var(--shadow);
}

.tool-panel,
.panel-card,
.login-card,
.login-brand-panel,
.modal-card,
.plan-card,
.stage-card,
.candidate-data-row,
.user-row,
.admin-summary-grid article {
    border-radius: 10px;
}

.page-heading,
.dashboard-welcome,
.process-page-head {
    color: var(--ink);
}

.eyebrow,
.plan-card span,
.permission-matrix strong,
.stage-form-name,
.admin-summary-grid article span,
.subscription-summary span,
.stat-tile span {
    color: var(--green);
    font-weight: 600;
}

.stat-tile strong,
.admin-summary-grid article strong,
.plan-card>strong,
.subscription-summary strong,
.process-main strong,
.stage-title-row strong,
.candidate-open strong {
    color: var(--ink);
    font-weight: 650;
}

.button,
.soft-action,
.link-action,
.validation-chip,
.muted-chip,
.score-pill {
    font-weight: 500;
}

.button-primary {
    color: #d9fff2;
    border-color: transparent;
    background: var(--green);
    box-shadow: 0 10px 22px rgba(0, 230, 138, 0.18);
}

.button-primary:hover {
    color: #07150f;
    background: #12f09a;
}

.button-ghost,
.google-button,
.soft-action.green,
.soft-action.purple {
    color: #dfffee;
    border-color: rgba(0, 230, 138, 0.24);
    background: rgba(0, 230, 138, 0.10);
}

.button-ghost:hover,
.google-button:hover,
.soft-action.green:hover,
.soft-action.purple:hover {
    color: #07150f;
    border-color: transparent;
    background: var(--green);
}

.icon-button,
.text-icon-button,
.drag-handle {
    color: var(--green);
    border: 0;
    background: transparent;
}

.icon-button:hover,
.text-icon-button:hover,
.drag-handle:hover {
    color: #07150f;
    background: var(--green);
}

.icon-button.danger,
.text-icon-button.danger {
    color: var(--danger);
}

.field input,
.field textarea,
.field select,
.search-strip,
.search-box input {
    color: var(--ink);
    border-color: var(--line);
    background: rgba(255, 255, 255, 0.06);
}

.field input::placeholder,
.field textarea::placeholder {
    color: rgba(247, 243, 255, 0.42);
}

.field input:focus,
.field textarea:focus,
.field select:focus {
    border-color: rgba(0, 230, 138, 0.72);
    box-shadow: 0 0 0 3px rgba(0, 230, 138, 0.12);
}

.modal-backdrop,
.side-sheet-backdrop,
.profile-drawer-backdrop {
    background: rgba(7, 2, 14, 0.72);
}

.modal-header,
.modal-footer,
.candidate-header-row,
.candidate-table-modern,
.section-head,
.profile-drawer-panel>header {
    border-color: var(--line);
}

.candidate-header-row,
.muted-chip,
.status-pill,
.profile-card>span,
.validation-chip {
    color: var(--muted);
    background: rgba(255, 255, 255, 0.07);
}

.status-pill.status-em-andamento,
.status-pill.status-novo,
.validation-chip,
.profile-card>span {
    color: #07150f;
    background: var(--green);
}

.process-main,
.quick-action-list a,
.profile-menu a,
.admin-plan-list article,
.buyer-list article,
.sheet-stage-card,
.builder-section,
.builder-field,
.plan-lock-popover {
    color: var(--ink);
    border-color: var(--line);
    background: var(--surface-soft);
}

.quick-action-list a:hover,
.profile-menu a:hover,
.process-row:hover,
.library-item:hover {
    border-color: rgba(0, 230, 138, 0.35);
    background: var(--surface-strong);
}

.profile-avatar-large,
.stage-number {
    color: #07150f;
    background: var(--green);
}

.login-main {
    min-height: 100vh;
}

.login-brand-panel {
    background:
        linear-gradient(140deg, rgba(0, 230, 138, 0.14), rgba(140, 109, 255, 0.12)),
        var(--surface);
}

.login-brand-panel h1,
.dashboard-welcome h1,
.page-heading h1,
.process-page-head h1 {
    font-weight: 650;
}

.login-separator::before,
.login-separator::after {
    background: var(--line);
}

.toast,
.plan-lock-popover {
    border: 1px solid var(--line);
    background: var(--surface-strong);
    color: var(--ink);
    box-shadow: var(--shadow);
}

.toast i,
.product-checklist i,
.plan-card li i {
    color: var(--green);
}

.plan-lock-popover {
    position: fixed;
    z-index: 140;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    width: min(420px, calc(100vw - 32px));
    padding: 14px;
    border-radius: 12px;
}

.plan-lock-popover i {
    color: var(--green);
}

.plan-lock-popover strong,
.plan-lock-popover span {
    display: block;
}

.plan-lock-popover span {
    color: var(--muted);
    font-size: 13px;
}

.plan-lock-popover a {
    color: #07150f;
    padding: 8px 10px;
    border-radius: 999px;
    background: var(--green);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.plan-lock-banner {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
    padding: 14px 16px;
}

.plan-lock-banner>i {
    color: var(--green);
}

.plan-lock-banner strong,
.plan-lock-banner span {
    display: block;
}

.plan-lock-banner span {
    color: var(--muted);
    font-size: 13px;
}

.admin-console-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
    gap: 16px;
}

.admin-panel-wide {
    grid-column: span 1;
}

.admin-plan-list,
.buyer-list {
    display: grid;
    gap: 10px;
}

.admin-plan-list article,
.buyer-list article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
}

.admin-plan-list strong,
.buyer-list strong,
.admin-plan-list small,
.buyer-list small {
    display: block;
}

.admin-plan-list span,
.buyer-list span {
    color: var(--green);
    font-weight: 600;
}

.admin-plan-list em,
.buyer-list em {
    color: var(--muted);
    font-style: normal;
    font-size: 12px;
}

@media (max-width: 1120px) {
    .admin-console-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {

    .plan-lock-banner,
    .plan-lock-popover,
    .admin-plan-list article,
    .buyer-list article {
        grid-template-columns: 1fr;
        align-items: stretch;
    }
}

/* Light theme pass with the same purple/green identity. */
:root {
    --bg: #f7faf9;
    --surface: #ffffff;
    --surface-soft: #f1f7f4;
    --surface-strong: #e7f3ee;
    --ink: #172033;
    --muted: #667085;
    --line: #dde7e2;
    --line-strong: #bfd1c9;
    --green: #00c879;
    --green-dark: #009f62;
    --teal: #14b8a6;
    --blue: #6d3fd6;
    --amber: #b7791f;
    --danger: #d92d20;
    --shadow: 0 12px 30px rgba(18, 5, 31, 0.08);
}

body,
.login-shell {
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(0, 200, 121, 0.08), rgba(109, 63, 214, 0.06)),
        var(--bg);
}

.app-topbar {
    border-bottom-color: var(--line);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 6px 22px rgba(18, 5, 31, 0.06);
}

.brand-mark {
    color: #08140f;
    background: var(--green);
}

.main-nav a {
    color: #495469;
}

.main-nav a:hover,
.main-nav a.is-active {
    color: #08140f;
    background: rgba(0, 200, 121, 0.18);
}

.tool-panel,
.panel-card,
.stat-tile,
.process-row,
.library-item,
.stage-card,
.candidate-data-row,
.modal-card,
.login-card,
.login-brand-panel,
.plan-card,
.user-row,
.permission-matrix section,
.admin-summary-grid article,
.profile-drawer-panel,
.side-sheet-backdrop .candidate-sheet-panel,
.plan-lock-banner,
.upgrade-plan-card {
    color: var(--ink);
    border-color: var(--line);
    background: var(--surface);
    box-shadow: var(--shadow);
}

.login-brand-panel {
    background:
        linear-gradient(140deg, rgba(0, 200, 121, 0.12), rgba(109, 63, 214, 0.10)),
        var(--surface);
}

.brand small,
.page-heading p,
.dashboard-welcome p,
.panel-header p,
.login-card p,
.login-brand-panel p,
.subscription-summary p,
.stage-card small,
.candidate-open small,
.profile-card p,
.app-footer,
.field span,
.user-identity small,
.permission-preview,
.plan-card p,
.plan-card small,
.admin-plan-list small,
.buyer-list small,
.upgrade-plan-card p,
.upgrade-plan-card small,
.upgrade-modal-note {
    color: var(--muted);
}

.field input,
.field textarea,
.field select,
.search-strip,
.search-box input {
    color: var(--ink);
    border-color: var(--line);
    background: #ffffff;
}

.field input::placeholder,
.field textarea::placeholder {
    color: #98a2b3;
}

.button-primary {
    color: #d9fff2;
    background: var(--green);
    box-shadow: 0 8px 18px rgba(0, 200, 121, 0.20);
}

.button-primary:hover {
    color: #08140f;
    background: #0ddd8b;
}

.button-ghost,
.google-button,
.soft-action.green,
.soft-action.purple {
    color: #185c42;
    border-color: rgba(0, 200, 121, 0.24);
    background: rgba(0, 200, 121, 0.10);
}

.button-ghost:hover,
.google-button:hover,
.soft-action.green:hover,
.soft-action.purple:hover {
    color: #08140f;
    background: rgba(0, 200, 121, 0.18);
}

.google-button {
    justify-content: center;
    color: #243044;
    border-color: #d7dde8;
    background: #ffffff;
}

.google-icon {
    display: inline-flex;
    width: 18px;
    height: 18px;
}

.google-icon svg {
    width: 18px;
    height: 18px;
}

.login-email-pill {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 42px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface-soft);
    font-size: 14px;
}

.login-email-pill span {
    min-width: 0;
    overflow: hidden;
    color: var(--ink);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.login-email-pill a {
    color: var(--blue);
    font-weight: 600;
}

.topbar-account {
    gap: 10px;
}

.upgrade-trigger {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 13px;
    color: #d9fff2;
    border: 0;
    border-radius: 999px;
    background: var(--green);
    font-weight: 650;
    box-shadow: 0 8px 18px rgba(0, 200, 121, 0.18);
}

.upgrade-trigger i {
    width: 17px;
    height: 17px;
}

.profile-trigger {
    border-color: var(--line);
    background: #ffffff;
}

.modal-backdrop,
.side-sheet-backdrop,
.profile-drawer-backdrop {
    background: rgba(18, 5, 31, 0.42);
}

.process-main,
.quick-action-list a,
.profile-menu a,
.admin-plan-list article,
.buyer-list article,
.sheet-stage-card,
.builder-section,
.builder-field,
.plan-lock-popover {
    color: var(--ink);
    border-color: var(--line);
    background: var(--surface-soft);
}

.quick-action-list a:hover,
.profile-menu a:hover,
.process-row:hover,
.library-item:hover {
    border-color: rgba(0, 200, 121, 0.42);
    background: #eef8f3;
}

.candidate-header-row,
.muted-chip,
.status-pill,
.profile-card>span,
.validation-chip {
    color: var(--muted);
    background: var(--surface-soft);
}

.status-pill.status-em-andamento,
.status-pill.status-novo,
.validation-chip,
.profile-card>span,
.profile-avatar-large,
.stage-number {
    color: #08140f;
    background: rgba(0, 200, 121, 0.20);
}

.toast,
.plan-lock-popover {
    color: var(--ink);
    border-color: var(--line);
    background: #ffffff;
}

.plan-lock-popover button {
    color: #08140f;
    padding: 8px 10px;
    border: 0;
    border-radius: 999px;
    background: var(--green);
    font-size: 12px;
    font-weight: 650;
    white-space: nowrap;
}

.upgrade-modal-card .modal-header {
    align-items: flex-start;
}

.upgrade-modal-card .modal-header p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 13px;
}

.upgrade-plan-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.upgrade-plan-card {
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 12px;
}

.upgrade-plan-card.is-highlight {
    border-color: rgba(0, 200, 121, 0.42);
    box-shadow: 0 16px 32px rgba(0, 200, 121, 0.12);
}

.upgrade-plan-card span {
    color: var(--blue);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.upgrade-plan-card h4 {
    margin: 4px 0;
    font-size: 20px;
}

.upgrade-plan-card p {
    margin: 0;
    line-height: 1.45;
}

.upgrade-plan-card>strong {
    font-size: 28px;
}

.upgrade-plan-card ul {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.upgrade-plan-card li {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #344054;
    font-size: 13px;
}

.upgrade-plan-card li i {
    color: var(--green-dark);
}

.upgrade-modal-note {
    margin: 14px 0 0;
    font-size: 13px;
}

.transparent-checkout {
    display: grid;
    gap: 14px;
    margin-top: 16px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #ffffff;
}

.transparent-checkout[hidden] {
    display: none;
}

.transparent-checkout-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
}

.transparent-checkout-header span,
.transparent-checkout-header small {
    display: block;
    color: var(--muted);
    font-size: 12px;
}

.transparent-checkout-header strong {
    display: block;
    margin: 4px 0;
    color: var(--ink);
    font-size: 18px;
    font-weight: 650;
}

.stripe-payment-element {
    min-height: 96px;
}

.checkout-message {
    min-height: 18px;
    margin: 10px 0;
    color: var(--muted);
    font-size: 13px;
}

.checkout-message.is-error {
    color: var(--red);
}

.button.is-loading {
    opacity: 0.72;
    cursor: progress;
}

@media (max-width: 1120px) {
    .upgrade-plan-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .upgrade-trigger span {
        display: none;
    }

    .upgrade-trigger {
        width: 38px;
        justify-content: center;
        padding: 0;
    }

    .upgrade-plan-grid {
        grid-template-columns: 1fr;
    }
}

/* Final requested refinements. */
body,
.login-shell {
    background: #ffffff;
}

.process-main {
    background: transparent;
}

.admin-plan-list {
    padding: 0 16px 16px;
}

.buyer-table {
    display: grid;
    gap: 8px;
    padding: 18px 16px 16px;
    overflow-x: auto;
}

.buyer-table-head,
.buyer-table-row {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) 120px 110px 90px 120px 100px 100px 140px;
    gap: 12px;
    align-items: center;
    min-width: 1040px;
}

.buyer-table-head {
    padding: 0 12px 4px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
}

.buyer-table-row {
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #ffffff;
}

.buyer-table-row span,
.buyer-table-row em,
.buyer-table-row small {
    color: #344054;
    font-style: normal;
    font-size: 13px;
}

.buyer-table-row>em {
    display: inline-flex;
    justify-content: center;
    width: max-content;
    min-width: 78px;
    padding: 5px 9px;
    border-radius: 999px;
    color: #185c42;
    background: rgba(0, 200, 121, 0.12);
    font-weight: 650;
}

.buyer-identity-cell strong,
.buyer-identity-cell small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.buyer-identity-cell small {
    color: var(--muted);
}

@media (max-width: 760px) {
    .buyer-table {
        padding-inline: 12px;
    }
}

.admin-dashboard-menu {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.admin-dashboard-menu a {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-height: 112px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: var(--shadow);
}

.admin-dashboard-menu a:hover {
    border-color: rgba(0, 200, 121, 0.42);
    background: #f5fbf8;
}

.admin-dashboard-menu a.is-active {
    border-color: rgba(0, 200, 121, 0.55);
    background: #effbf6;
    box-shadow: 0 14px 32px rgba(0, 151, 92, 0.12);
}

.admin-dashboard-menu i {
    width: 22px;
    height: 22px;
    color: var(--green-dark);
}

.admin-dashboard-menu strong,
.admin-dashboard-menu small {
    display: block;
}

.admin-dashboard-menu strong {
    margin-bottom: 5px;
    font-size: 15px;
}

.admin-dashboard-menu small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.4;
}

.admin-summary-grid {
    display: none !important;
}

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

.admin-metrics-grid article {
    display: grid;
    gap: 7px;
    min-height: 118px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: var(--shadow);
}

.admin-metrics-grid span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
    text-transform: uppercase;
}

.admin-metrics-grid strong {
    color: var(--ink);
    font-size: 26px;
    font-weight: 720;
}

.admin-metrics-grid small {
    color: var(--muted);
    line-height: 1.35;
}

.admin-console-grid[data-admin-active="overview"] {
    grid-template-columns: 1fr;
}

.admin-console-grid[data-admin-active="overview"]>[data-admin-panel] {
    display: none;
}

.admin-console-grid[data-admin-active]:not([data-admin-active="overview"])>[data-admin-overview] {
    display: none;
}

.admin-overview-dashboard {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
    gap: 16px;
}

.admin-chart-panel {
    min-height: 340px;
}

.admin-sales-chart {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
    min-height: 240px;
    align-items: end;
    padding: 12px 16px 18px;
}

.admin-sales-chart div {
    display: grid;
    gap: 8px;
    align-items: end;
    text-align: center;
}

.admin-sales-chart i {
    display: block;
    height: var(--bar);
    min-height: 8px;
    border-radius: 10px 10px 4px 4px;
    background: linear-gradient(180deg, var(--green), #6d3fd6);
}

.admin-sales-chart strong {
    color: var(--ink);
    font-size: 12px;
    font-weight: 650;
}

.admin-sales-chart span {
    color: var(--muted);
    font-size: 12px;
}

.admin-ranking-panel,
.admin-health-panel {
    min-height: 0;
}

.admin-ranking-list {
    display: grid;
    gap: 12px;
    padding: 16px 16px 16px;
}

.admin-ranking-list article {
    display: grid;
    gap: 8px;
}

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

.admin-ranking-list small {
    color: var(--muted);
}

.admin-ranking-list i {
    display: block;
    width: var(--rank);
    height: 8px;
    border-radius: 999px;
    background: var(--green);
}

.admin-health-panel {
    grid-column: 1 / -1;
}

.admin-health-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    padding: 16px 16px 16px;
}

.admin-health-grid article {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fbfa;
}

.admin-health-grid span {
    color: var(--muted);
    font-size: 12px;
}

.admin-health-grid strong {
    color: var(--ink);
    font-size: 20px;
}

.admin-console-grid[data-admin-active]:not([data-admin-active="overview"]) {
    grid-template-columns: 1fr;
}

.admin-console-grid[data-admin-active]:not([data-admin-active="overview"])>[data-admin-panel]:not(.is-active) {
    display: none;
}

.admin-console-grid[data-admin-active]:not([data-admin-active="overview"])>[data-admin-panel].is-active {
    grid-column: 1 / -1;
}

.admin-detail-only {
    display: none;
}

.admin-console-grid[data-admin-active]:not([data-admin-active="overview"]) .admin-detail-only {
    display: block;
}

.admin-console-grid[data-admin-active]:not([data-admin-active="overview"]) .plans-grid.admin-detail-only {
    display: grid;
    margin-top: 14px;
    padding: 0 16px;
}

.panel-subheader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 4px 16px 0;
}

.panel-subheader h3 {
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 650;
}

.panel-subheader p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
}

.admin-users-detail {
    border-top: 1px solid var(--line);
    padding-top: 14px;
}

.manage-account-link {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    padding: 0 13px;
    border-radius: 999px;
    color: #08140f;
    background: var(--green);
    font-size: 13px;
    font-weight: 650;
}

.profile-avatar-large {
    padding: 0;
    border: 0;
    color: inherit;
    cursor: pointer;
}

.profile-avatar-large:hover {
    box-shadow: 0 0 0 4px rgba(0, 200, 121, 0.14);
}

.profile-photo-sheet {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: rgba(17, 24, 39, 0.22);
}

.profile-photo-sheet.is-open {
    display: flex;
}

.profile-photo-card {
    display: grid;
    width: min(320px, 100%);
    gap: 6px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 24px 60px rgba(18, 5, 31, 0.18);
}

.profile-photo-card strong {
    padding: 4px 6px 8px;
    color: var(--ink);
    font-size: 15px;
    font-weight: 650;
}

.profile-photo-card button {
    display: flex;
    min-height: 42px;
    align-items: center;
    gap: 10px;
    padding: 0 10px;
    border: 0;
    border-radius: 10px;
    color: #243044;
    background: transparent;
    font: inherit;
    cursor: pointer;
}

.profile-photo-card button:hover {
    background: #f3f7f5;
}

.profile-photo-card button:last-of-type {
    justify-content: center;
    color: var(--muted);
}

.profile-photo-card i {
    width: 18px;
    height: 18px;
    color: var(--green-dark);
}

.profile-drawer-panel {
    display: flex;
    flex-direction: column;
}

.profile-menu {
    margin-top: auto;
}

.profile-logout {
    margin-top: 18px;
    color: var(--danger) !important;
    background: #fff5f5;
}

.profile-card .profile-avatar-large {
    cursor: default;
}

.profile-card .profile-avatar-large:hover {
    box-shadow: none;
}

.text-icon-button.is-disabled,
.soft-action.is-disabled,
.link-action.is-disabled {
    color: #98a2b3 !important;
    background: #f2f4f7 !important;
    cursor: not-allowed;
    pointer-events: none;
}

.text-icon-button.is-disabled i,
.soft-action.is-disabled i,
.link-action.is-disabled i {
    color: #98a2b3 !important;
}

.candidate-actions .public-link-control~.text-icon-button[data-copy]:not(.public-link-control),
.candidate-actions .public-link-control~.text-icon-button[data-qr]:not(.public-link-control),
.sheet-stage-actions .public-link-control~[data-copy]:not(.public-link-control),
.sheet-stage-actions .public-link-control~[data-qr]:not(.public-link-control),
.library-actions [data-form-delete-blocked]+form {
    display: none;
}

.app-toast {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 140;
    max-width: min(360px, calc(100vw - 32px));
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    color: #101828;
    background: #ffffff;
    box-shadow: 0 18px 44px rgba(18, 5, 31, 0.16);
    font-size: 13px;
    opacity: 0;
    transform: translateY(10px);
    pointer-events: none;
    transition: 0.18s ease;
}

.app-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.blocked-usage-list {
    display: grid;
    gap: 8px;
}

.blocked-usage-list article {
    display: grid;
    gap: 3px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fbfa;
}

.blocked-usage-list strong,
.blocked-usage-list span {
    display: block;
}

.blocked-usage-list span {
    color: var(--muted);
    font-size: 13px;
}

.danger-soft {
    color: #ffffff;
    background: var(--danger);
}

.account-grid {
    display: grid;
    grid-template-columns: minmax(360px, 0.9fr) minmax(0, 1.1fr);
    gap: 16px;
    align-items: start;
}

.account-password-panel {}

.account-avatar-preview {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 88px;
    height: 88px;
    overflow: hidden;
    border-radius: 999px;
    color: #08140f;
    background: rgba(0, 200, 121, 0.22);
    font-size: 28px;
    font-weight: 700;
}

.account-avatar-preview.is-editable {
    padding: 0;
    border: 0;
    cursor: pointer;
}

.account-avatar-preview.is-editable>i,
.account-avatar-preview.is-editable>svg {
    position: absolute;
    top: 31px;
    right: 30px;
    width: 30px;
    height: 30px;
    padding: 7px;
    border: 2px solid #ffffff;
    border-radius: 999px;
    color: #08140f;
    background: var(--green);
}

.account-avatar-preview.is-editable:hover {
    box-shadow: 0 0 0 4px rgba(0, 200, 121, 0.14);
}

.account-avatar-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.account-logo-preview {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 88px;
    height: 88px;
    border-radius: 12px;
    color: #08140f;
    background: rgba(0, 200, 121, 0.22);
    font-size: 16px;
    font-weight: 700;
}

.account-logo-preview.is-editable {
    padding: 0;
    border: 0;
    cursor: pointer;
}

.account-logo-preview.is-editable>i,
.account-logo-preview.is-editable>svg {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 28px;
    height: 28px;
    padding: 6px;
    border: 2px solid #ffffff;
    border-radius: 999px;
    color: #08140f;
    background: var(--green);
}

.account-logo-preview.is-editable:hover {
    box-shadow: 0 0 0 4px rgba(0, 200, 121, 0.14);
}

.account-logo-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}

.account-plan-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding: 16px 16px 14px;
}

.account-plan-summary article {
    display: grid;
    gap: 5px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #ffffff;
}

.account-plan-summary span,
.usage-meter strong {
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
    text-transform: uppercase;
}

.account-plan-summary strong {
    font-size: 20px;
}

.account-plan-summary small {
    color: var(--muted);
    line-height: 1.35;
}

.usage-meter-list {
    display: grid;
    gap: 12px;
    padding: 0 16px 16px;
}

.usage-meter {
    display: grid;
    gap: 8px;
}

.usage-meter div {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.usage-meter span {
    color: var(--ink);
    font-weight: 650;
}

.usage-meter i {
    display: block;
    height: 9px;
    overflow: hidden;
    border-radius: 999px;
    background: #e7ece9;
}

.usage-meter i::before {
    display: block;
    width: var(--usage);
    height: 100%;
    border-radius: inherit;
    background: var(--green);
    content: "";
}

body .admin-summary-grid {
    display: none !important;
}

body .admin-console-grid[data-admin-active="overview"]>[data-admin-panel] {
    display: none !important;
}

body .admin-console-grid[data-admin-active]:not([data-admin-active="overview"])>[data-admin-overview] {
    display: none !important;
}

body {
    background: #ffffff;
}

.button-primary {
    color: #d9fff2;
    background: var(--green);
    box-shadow: 0 10px 22px rgba(0, 200, 121, 0.18);
    font-weight: 650;
}

.button-primary:hover {
    background: #18b97f;
}

.button-primary.danger-soft,
.button-primary.danger-soft:hover {
    color: #ffffff;
    background: var(--danger);
    box-shadow: 0 10px 22px rgba(217, 45, 32, 0.18);
}

.danger-soft-text {
    color: var(--danger);
    border-color: rgba(217, 45, 32, 0.22);
    background: #fff5f5;
}

.hero-actions form,
.modal-footer form {
    margin: 0;
}

.test-mode-banner {
    position: sticky;
    top: 72px;
    z-index: 19;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 18px;
    border-bottom: 1px solid rgba(245, 159, 24, 0.28);
    color: #7a4a00;
    background: #fff8e8;
    font-size: 13px;
    font-weight: 550;
}

.test-mode-banner i,
.test-mode-banner svg {
    width: 17px;
    height: 17px;
}

.account-avatar-preview.is-editable {
    isolation: isolate;
}

.account-avatar-preview.is-editable>i,
.account-avatar-preview.is-editable>svg {
    top: 6px;
    right: 6px;
    z-index: 3;
    width: 28px;
    height: 28px;
    padding: 6px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.16);
}

.profile-photo-card button.danger {
    color: var(--danger);
}

.profile-photo-card button.danger i,
.profile-photo-card button.danger svg {
    color: var(--danger);
}

.stripe-config-form {
    padding: 16px 16px 16px;
}

.ai-fallback-form {
    padding: 15px 16px 16px;
}

.stripe-mode-control {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #f8fbfa;
}

.stripe-mode-control strong,
.stripe-mode-control span,
.stripe-mode-control em {
    display: block;
}

.stripe-mode-control span {
    margin-top: 3px;
    color: var(--green-dark);
    font-size: 13px;
    font-weight: 650;
}

.mode-switch {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--muted);
    font-size: 13px;
    font-style: normal;
}

.mode-switch input[type="checkbox"] {
    display: none;
}

.mode-switch span {
    position: relative;
    width: 52px;
    height: 28px;
    border-radius: 999px;
    background: #dce3ec;
    transition: 0.18s ease;
}

.mode-switch span::before {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 3px 10px rgba(23, 32, 51, 0.18);
    transition: 0.18s ease;
    content: "";
}

.mode-switch input[type="checkbox"]:checked+span {
    background: var(--green);
}

.mode-switch input[type="checkbox"]:checked+span::before {
    transform: translateX(24px);
}

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

.stripe-env-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #ffffff;
}

.stripe-env-card.is-active {
    border-color: rgba(0, 200, 121, 0.48);
    box-shadow: 0 12px 28px rgba(0, 151, 92, 0.10);
}

.stripe-env-title {
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.stripe-env-title i,
.stripe-env-title svg {
    width: 20px;
    height: 20px;
    color: var(--green-dark);
}

.stripe-env-title strong,
.stripe-env-title small {
    display: block;
}

.stripe-env-title small {
    margin-top: 3px;
    color: var(--muted);
    line-height: 1.35;
}

.ai-fallback-note {
    display: flex;
    gap: 12px;
    padding: 14px;
    border: 1px solid rgba(0, 200, 121, 0.24);
    border-radius: 12px;
    color: #123026;
    background: #f3fcf8;
}

.ai-fallback-note i,
.ai-fallback-note svg {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    color: var(--green-dark);
}

.ai-fallback-note strong,
.ai-fallback-note span {
    display: block;
}

.ai-fallback-note span {
    margin-top: 3px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.4;
}

.ai-provider-stack {
    display: grid;
    gap: 12px;
}

.ai-provider-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #ffffff;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.ai-provider-card.is-dragging {
    opacity: 0.62;
}

.ai-provider-card.is-open {
    border-color: rgba(0, 200, 121, 0.42);
    box-shadow: 0 12px 26px rgba(23, 32, 51, 0.08);
}

.ai-provider-main {
    display: grid;
    grid-template-columns: 28px 34px minmax(0, 1fr) auto 40px;
    gap: 10px;
    align-items: center;
    padding: 12px;
}

.ai-provider-main .drag-handle {
    color: var(--blue);
    background: transparent;
}

.ai-priority {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 999px;
    color: var(--blue);
    background: #e8f0ff;
    font-weight: 650;
}

.ai-provider-heading {
    min-width: 0;
}

.ai-provider-heading strong,
.ai-provider-heading small {
    display: block;
}

.ai-provider-heading strong {
    font-size: 15px;
    font-weight: 650;
}

.ai-provider-heading small {
    overflow: hidden;
    color: var(--muted);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.switch-line.compact {
    margin: 0;
    padding: 0;
}

.ai-provider-settings {
    display: none;
    gap: 12px;
    padding: 13px 12px 16px 84px;
    border-top: 1px solid var(--line);
    background: #fbfdfc;
}

.ai-provider-card.is-open .ai-provider-settings {
    display: grid;
}

.ai-provider-card.is-open [data-ai-toggle] svg {
    transform: rotate(180deg);
}

@media (max-width: 1120px) {
    .admin-dashboard-menu {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .stripe-env-grid {
        grid-template-columns: 1fr;
    }

    .account-grid,
    .account-plan-summary {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .admin-dashboard-menu {
        grid-template-columns: 1fr;
    }

    .stripe-mode-control,
    .ai-provider-main {
        grid-template-columns: 1fr;
    }

    .stripe-mode-control {
        align-items: flex-start;
    }

    .ai-provider-settings {
        padding-left: 12px;
    }
}

@media print {
    @page {
        margin: 0.1cm;
    }

    .app-topbar,
    .heading-actions,
    .toast,
    .back-link {
        display: none !important;
    }

    .app-main {
        width: 100%;
        margin: 0;
    }

    .tool-panel,
    .report-summary>article {
        box-shadow: none;
    }


    body {
        background: #fff;
    }

    .print-container {
        padding: 0;
        max-width: none;
    }

    .toast {
        display: none !important;
    }
}

/* PRINT STYLES */
.print-main {
    padding: 0;
    background: #fff;
    min-height: 100vh;
}

.print-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 40px;
    font-family: 'Inter', sans-serif;
    color: #000;
}

.print-header {
    margin-bottom: 30px;
}

.print-brand {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
}

.print-logo {
    max-width: 120px;
    max-height: 80px;
    object-fit: contain;
}

.print-logo-placeholder {
    width: 80px;
    height: 80px;
    border: 2px dashed #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: #999;
}

.print-company-info h2 {
    margin: 0 0 5px;
    font-size: 20px;
}

.print-company-info p {
    margin: 2px 0;
    font-size: 12px;
    color: #444;
}

.print-divider {
    border: 0;
    border-top: 1px solid #c9c9c9;
    margin: 9px 0;
}

.print-meta {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    line-height: 0.8;
}

.text-right {
    text-align: right;
}

.print-body {
    margin-top: 40px;
}

.print-section-title {
    font-size: 16px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 5px;
    margin: 30px 0 15px;
}

.print-question {
    margin-bottom: 25px;
    page-break-inside: avoid;
}

.print-question-label {
    font-size: 14px;
    margin-bottom: 10px;
}

.print-answer-space {
    margin-top: 10px;
}

.print-line {
    border-bottom: 1px solid #999;
    height: 25px;
    margin-bottom: 10px;
}

.print-line.single {
    margin-top: 20px;
}

.print-options span {
    margin-right: 30px;
    font-size: 14px;
}

.print-footer {
    margin-top: 60px;
    text-align: center;
    font-size: 14px;
    page-break-inside: avoid;
}

.user-org-accordion > summary .accordion-icon {
    transition: transform 0.2s ease;
}
.user-org-accordion[open] > summary .accordion-icon {
    transform: rotate(90deg);
}

/* =========================================
   MOBILE OVERRIDES (adicionados para responsividade)
   ========================================= */
@media (max-width: 1120px) {
    /* Admin overview: empilhar vendas + ranking em coluna única */
    .admin-overview-dashboard {
        grid-template-columns: 1fr !important;
    }
    
    /* Ocultar links extras da barra inferior (eles vão pro menu "Mais") */
    .app-topbar .main-nav a.hide-on-mobile,
    nav.main-nav a.hide-on-mobile {
        display: none !important;
    }
    
    /* Botão "Mais opções" deve aparecer na barra inferior */
    .more-menu-btn.hide-on-desktop {
        display: flex !important;
    }
    
    /* app-main width no mobile */
    .app-main {
        width: calc(100% - 22px) !important;
    }
}

/* Link de afiliado — flex row normal, quebra para coluna no mobile */
.affiliate-link-row {
    display: flex;
    gap: 12px;
    align-items: center;
}

@media (max-width: 600px) {
    .affiliate-link-row {
        flex-direction: column;
        align-items: stretch;
    }
    .affiliate-link-row input {
        width: 100% !important;
    }
    .affiliate-link-row .button {
        width: 100%;
        justify-content: center;
    }
}.candidate-name-fade { position: relative; overflow: hidden; white-space: nowrap; mask-image: linear-gradient(to left, transparent, black 24px); -webkit-mask-image: linear-gradient(to left, transparent, black 24px); }
/* 
 * Theme: Helena (Custom)
 * Cores principais: Verde vibrante e Roxo escuro
 */

:root {
    /* Cores principais atualizadas */
    --ink: #1e1a3a;       /* Roxo bem escuro (para textos principais e botões primários) */
    --green: #00d064;     /* Verde igual ao da imagem 3 */
    --green-dark: #00a650;
    
    /* Ajustes complementares */
    --bg: #f4f5fa;        /* Fundo um pouco mais limpo */
    --blue: #1e1a3a;      /* Trocando o azul padrão pelo roxo escuro para coerência visual */
    --muted: #7b788a;     /* Tom de cinza levemente puxado pro roxo */
    --line: #e3e2ec;
}

/* Esconder classes dependendo do dispositivo (Desktop vs Mobile) */
.hide-on-desktop { display: none !important; }
.app-topbar .main-nav a.hide-on-mobile, nav.main-nav a.hide-on-mobile { display: none !important; }

/* Sobrescrevendo o fundo do body para remover o gradiente antigo, deixando mais clean */
body {
    background: var(--bg);
}

/* Botões Primários (usando o roxo escuro) */
.button-primary {
    background-color: var(--ink) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 6px 16px rgba(30, 26, 58, 0.2) !important;
}

.button-primary:hover {
    background-color: #120f26 !important;
}

/* Opcional: Se algum botão ou destaque usar a cor verde */
.button-green {
    background-color: var(--green) !important;
    color: #ffffff !important;
}

/* Ícone/Marca da Logo */
.brand-mark {
    background: var(--green) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(0, 208, 100, 0.25) !important;
    border-radius: 10px !important;
}

/* Topbar */
.app-topbar {
    border-bottom: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.95);
}

/* Links do menu lateral ativos (se houver) */
.sidebar-nav a.active,
.app-nav a.active {
    color: var(--ink) !important;
    font-weight: 600;
}
.sidebar-nav a.active i,
.app-nav a.active i {
    color: var(--green) !important;
}

/* Badges / Tags */
.badge.green {
    background: rgba(0, 208, 100, 0.15) !important;
    color: var(--green-dark) !important;
}

.badge.purple {
    background: rgba(30, 26, 58, 0.1) !important;
    color: var(--ink) !important;
}

/* Top menu hover and active states */
.main-nav a:hover,
.main-nav a.is-active,
.main-nav a.active {
    color: var(--ink) !important;
}

.main-nav a:hover i,
.main-nav a.is-active i,
.main-nav a.active i {
    color: var(--green) !important;
}
/* 50/50 grid for dashboard */
.saas-dashboard-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: start;
}
@media (max-width: 900px) {
    .saas-dashboard-grid {
        grid-template-columns: 1fr;
    }
}

/* Stat tile icons */
.stat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    margin-bottom: 12px;
}
.stat-icon i {
    width: 20px;
    height: 20px;
}

/* Mobile Bottom Navigation & Login Layout */
@media (max-width: 1120px) {
    body {
        padding-bottom: 64px; /* Space for bottom nav */
    }
    
    .app-topbar .main-nav,
    nav.main-nav {
        position: fixed !important;
        bottom: 0 !important;
        top: auto !important;
        left: 0 !important;
        width: 100% !important;
        background: var(--surface, #ffffff) !important;
        border-top: 1px solid var(--line) !important;
        display: flex !important;
        justify-content: space-around !important;
        padding: 8px 0 !important;
        z-index: 1000 !important;
        box-shadow: 0 -2px 10px rgba(0,0,0,0.05) !important;
        flex-direction: row !important;
        overflow: visible !important;
    }
    
    .app-topbar .main-nav a,
    nav.main-nav a {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        font-size: 10px !important;
        padding: 4px 8px !important;
        color: var(--muted) !important;
        text-decoration: none !important;
        flex: 1 !important;
    }
    
    .app-topbar .main-nav a i,
    nav.main-nav a i {
        margin: 0 !important;
        width: 20px !important;
        height: 20px !important;
    }
    
    .app-topbar .main-nav a.is-active,
    .app-topbar .main-nav a.active,
    nav.main-nav a.is-active,
    nav.main-nav a.active {
        color: var(--ink) !important;
    }
    
    .app-topbar .main-nav a.is-active i,
    .app-topbar .main-nav a.active i,
    nav.main-nav a.is-active i,
    nav.main-nav a.active i {
        color: var(--green) !important;
    }

    /* Colocar formulário de login por cima (ordem) */
    .login-shell-grid {
        display: flex !important;
        flex-direction: column-reverse !important;
    }

    /* Remover o backdrop do app-topbar que atrapalha o fixed do menu inferior */
    .app-topbar {
        backdrop-filter: none !important;
    }

    /* Painel - Blocos de estatísticas */
    .stats-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 12px !important;
    }
    .stat-tile {
        padding: 12px !important;
        min-height: auto !important;
    }
    .stat-tile strong {
        font-size: 20px !important;
    }
    .stat-icon {
        width: 32px !important;
        height: 32px !important;
        margin-bottom: 8px !important;
    }
    .stat-icon i {
        width: 100% !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        margin-left: 0 !important;
    }

    /* Recomende e ganhe */
    .affiliate-link-box {
        max-width: 100% !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
    }
    .affiliate-link-box input {
        width: 100% !important;
        min-width: 0 !important;
    }
    .affiliate-hero {
        text-align: center !important;
    }
    .affiliate-hero h1 {
        text-align: center !important;
    }
    .affiliate-hero p {
        text-align: center !important;
    }

    /* Mais Menu Mobile */
    .hide-on-mobile { display: none !important; }
    .hide-on-desktop { display: flex !important; }

    .more-menu-btn {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        font-size: 10px !important;
        padding: 4px 8px !important;
        color: var(--muted) !important;
        background: transparent !important;
        border: none !important;
        flex: 1 !important;
        cursor: pointer;
    }
    .more-menu-btn i { width: 20px !important; height: 20px !important; margin: 0 !important; }

    .mobile-more-overlay {
        position: fixed !important;
        top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
        background: rgba(0,0,0,0.5) !important;
        z-index: 2000 !important;
        visibility: hidden;
        opacity: 0;
        transition: opacity 0.3s, visibility 0.3s;
    }
    .mobile-more-overlay.is-open {
        visibility: visible !important;
        opacity: 1 !important;
    }
    .mobile-more-content {
        position: absolute !important;
        bottom: 0 !important; left: 0 !important; right: 0 !important;
        background: var(--surface) !important;
        border-radius: 16px 16px 0 0 !important;
        transform: translateY(100%);
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        padding: 16px !important;
        padding-bottom: max(16px, env(safe-area-inset-bottom)) !important;
    }
    .mobile-more-overlay.is-open .mobile-more-content {
        transform: translateY(0) !important;
    }
    .mobile-more-header {
        display: flex !important; justify-content: space-between !important; align-items: center !important; margin-bottom: 16px !important;
        font-size: 16px !important; color: var(--ink) !important;
    }
    .mobile-more-list {
        display: flex !important; flex-direction: column !important; gap: 12px !important;
    }
    .mobile-more-list a {
        display: flex !important; align-items: center !important; gap: 12px !important; padding: 12px !important;
        background: var(--bg) !important; border-radius: 8px !important; text-decoration: none !important; color: var(--ink) !important;
        flex-direction: row !important;
        font-size: 14px !important;
    }
    .mobile-more-list a i { color: var(--green) !important; width: 20px !important; height: 20px !important; }

    /* Super Admin - Menu Responsivo */
    .admin-dashboard-menu {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }
    .admin-dashboard-link {
        padding: 10px !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        justify-content: center !important;
        gap: 6px !important;
        min-height: 63px !important;
    }
    .admin-dashboard-link i {
        margin: 0 !important;
    }
    .admin-dashboard-link strong {
        font-size: 13px !important;
    }
    .admin-dashboard-link small {
        display: none !important; /* Esconder descrição para poupar espaço no mobile */
    }

    /* Super Admin - Ranking, Saúde e Console */
    .admin-console-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    
    .admin-overview-dashboard {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    .admin-ranking-panel {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
    }
    .admin-ranking-panel .panel-header {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    
    .admin-health-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }
    
    .admin-health-grid article {
        padding: 12px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 4px !important;
        overflow: hidden !important;
    }
    .admin-health-grid article span {
        font-size: 11px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        width: 100% !important;
    }
    .admin-health-grid article strong {
        font-size: 16px !important;
    }

    /* Textos menores para cabeçalhos (Operação, Entrevistas, etc) */
    .page-heading h1,
    .page-heading h2 {
        font-size: 22px !important;
    }
    .page-heading p {
        font-size: 13px !important;
    }
    .page-heading .eyebrow {
        font-size: 11px !important;
    }

    /* Evitar que os painéis fiquem maiores que a tela */
    .dashboard-grid,
    .tool-panel,
    .process-tab-content,
    .process-list,
    .form-library {
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }
    
    .process-tabs {
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        overflow-x: auto !important;
        gap: 4px !important;
    }
    
    .process-tabs button {
        font-size: 12px !important;
        padding: 6px 8px !important;
    }

    .process-row {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 12px !important;
        padding: 12px !important;
    }
    .process-main {
        max-width: 100% !important;
        width: 100% !important;
    }

    .app-topbar .main-nav a.hide-on-mobile, nav.main-nav a.hide-on-mobile { display: none !important; }
}

/* Spin animation for AI loading indicator */
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.candidate-name-fade { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; mask-image: linear-gradient(to left, transparent 0%, black 15%); -webkit-mask-image: linear-gradient(to left, transparent 0%, black 15%); }

/* Public form question label font size enhancement */
.public-field > span,
.public-field > legend,
fieldset.public-field legend,
.field.public-field span {
    font-size: 17px !important;
    font-weight: 600 !important;
    color: var(--ink, #1e293b) !important;
    margin-bottom: 10px !important;
    line-height: 1.4 !important;
    display: block !important;
}

/* Checkout Bottom Sheet / Modal */
.checkout-modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.4);
    z-index: 99999;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
}

.checkout-modal-backdrop.is-open {
    opacity: 1;
    visibility: visible;
}

.checkout-bottom-sheet {
    background: var(--surface);
    width: 100%;
    max-width: 500px;
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
    transform: translateY(20px);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    max-height: 90vh;
}

.checkout-modal-backdrop.is-open .checkout-bottom-sheet {
    transform: translateY(0);
}

.checkout-content {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

.checkout-drag-handle {
    display: none;
}

@media (max-width: 768px) {
    .checkout-modal-backdrop {
        align-items: flex-end;
    }
    
    .checkout-bottom-sheet {
        max-width: 100%;
        height: 95vh;
        max-height: 95vh;
        border-radius: 20px 20px 0 0;
        transform: translateY(100%);
        transition: transform 0.3s cubic-bezier(0.32, 0.72, 0, 1);
    }
    
    .checkout-drag-handle {
        display: block;
        width: 100%;
        height: 24px;
        position: relative;
        cursor: grab;
        flex-shrink: 0;
        background: var(--surface);
        touch-action: none;
    }
    
    .checkout-drag-handle::after {
        content: '';
        position: absolute;
        top: 10px;
        left: 50%;
        transform: translateX(-50%);
        width: 40px;
        height: 4px;
        background: var(--line-strong);
        border-radius: 2px;
    }
    
    .checkout-bottom-sheet.is-dragging {
        transition: none;
    }
}