:root {
    color: #10213d;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    font-synthesis: none;
}

* {
    box-sizing: border-box;
}

body {
    min-width: 320px;
    min-height: 100vh;
    margin: 0;
    background: #edf1f8;
}

button,
input {
    font: inherit;
}

.login-page {
    display: grid;
    min-height: 100vh;
    grid-template-columns: minmax(0, 1.65fr) minmax(390px, 1fr);
}

.brand-panel {
    position: relative;
    display: flex;
    overflow: hidden;
    min-height: 100%;
    align-items: center;
    background: linear-gradient(135deg, #102858 0%, #173a8d 70%, #1f46a9 100%);
    color: #fff;
}

.brand-content {
    position: relative;
    z-index: 1;
    width: min(650px, 100%);
    margin: 0 7vw;
}

.brand-kicker {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 47px;
    font-size: 16px;
}

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

.brand-kicker small {
    margin-top: 3px;
    color: #e7efff;
    font-size: 13px;
    font-weight: 400;
}

.rm-mark {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    background: linear-gradient(135deg, #6ed2ef, #38b5d8);
    color: #092d5e;
    font-size: 15px;
    font-weight: 800;
}

.brand-copy h1 {
    max-width: 600px;
    margin: 0;
    font-size: clamp(42px, 5.1vw, 64px);
    font-weight: 750;
    letter-spacing: -0.045em;
    line-height: 1.07;
}

.brand-copy p {
    max-width: 615px;
    margin: 19px 0 0;
    color: #f4f7ff;
    font-size: 17px;
    line-height: 1.65;
}

.brand-arcs {
    position: absolute;
    right: -121px;
    bottom: -138px;
    width: 550px;
    height: 550px;
    border: 70px solid rgb(115 151 255 / 18%);
    border-radius: 50%;
}

.brand-arcs::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 69px solid rgb(115 151 255 / 16%);
    border-radius: 50%;
    content: "";
    transform: scale(0.69);
}

.login-panel {
    display: grid;
    min-height: 100%;
    place-items: center;
    padding: 32px;
    background: #edf1f8;
}

.login-card {
    width: min(100%, 430px);
    padding: 35px;
    border: 1px solid #dbe3ef;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 22px 45px rgb(15 37 80 / 12%);
}

.environment-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0 0 23px;
    padding: 6px 11px;
    border-radius: 999px;
    background: #e8f0ff;
    color: #1d54d8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.environment-badge span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #2a66ed;
}

.login-card h2,
.dashboard-card h1 {
    margin: 0;
    color: #0d2446;
    font-size: 27px;
    font-weight: 750;
    letter-spacing: -0.03em;
}

.login-intro {
    margin: 10px 0 26px;
    color: #61728d;
    font-size: 16px;
    line-height: 1.5;
}

.field-group {
    margin-top: 17px;
}

.field-group label {
    display: block;
    margin-bottom: 7px;
    color: #112b52;
    font-size: 13px;
    font-weight: 750;
}

.field-group input {
    width: 100%;
    height: 48px;
    padding: 0 13px;
    border: 1px solid #bdcadc;
    border-radius: 12px;
    outline: 0;
    background: #fff;
    color: #10213d;
    transition: border-color 140ms ease, box-shadow 140ms ease;
}

.field-group input:focus-visible {
    border: 2px solid #2865ed;
    box-shadow: 0 0 0 3px rgb(40 101 237 / 16%);
}

.login-card button {
    width: 100%;
    min-height: 48px;
    margin-top: 20px;
    border: 0;
    border-radius: 12px;
    background: #2963e9;
    color: #fff;
    cursor: pointer;
    font-size: 15px;
    font-weight: 750;
    transition: background 140ms ease, transform 140ms ease;
}

.login-card button:hover {
    background: #1f55ce;
}

.login-card button:focus-visible {
    outline: 3px solid rgb(40 101 237 / 30%);
    outline-offset: 3px;
}

.login-card button:active {
    transform: translateY(1px);
}

.form-alert {
    margin: 0 0 19px;
    padding: 11px 12px;
    border: 1px solid #f2b8bd;
    border-radius: 10px;
    background: #fff1f2;
    color: #a21928;
    font-size: 14px;
    line-height: 1.4;
}

.dashboard-page {
    display: grid;
    min-height: 100vh;
    place-items: center;
    padding: 32px;
    background: linear-gradient(135deg, #edf1f8, #dce7fa);
}

.dashboard-card {
    width: min(100%, 600px);
    padding: 38px;
    border: 1px solid #dbe3ef;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 22px 45px rgb(15 37 80 / 12%);
}

.dashboard-card > p:not(.environment-badge) {
    margin: 14px 0 27px;
    color: #61728d;
    line-height: 1.6;
}

.context-summary {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin: 0;
}

.context-summary div {
    padding: 13px;
    border-radius: 12px;
    background: #f4f7fc;
}

.context-summary dt {
    color: #63728a;
    font-size: 12px;
    font-weight: 700;
}

.context-summary dd {
    margin: 6px 0 0;
    color: #10213d;
    font-size: 15px;
    font-weight: 750;
    overflow-wrap: anywhere;
}

.context-data {
    margin: 0;
    color: #10213d;
    font: 600 13px/1.55 "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    text-align: left;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.branch-list {
    display: grid;
    gap: 6px;
    margin: 0;
    padding-left: 18px;
    font-weight: 600;
}

.branch-list span {
    color: #63728a;
    font-weight: 700;
}

.secondary-button {
    background: #e7eefb;
    color: #173f8d;
}

.secondary-button:hover {
    background: #d5e2f9;
}

@media (max-width: 960px) {
    .login-page {
        grid-template-columns: 1fr;
    }

    .brand-panel {
        min-height: 255px;
    }

    .brand-content {
        margin: 42px max(24px, 7vw);
    }

    .brand-kicker {
        margin-bottom: 25px;
    }

    .brand-copy p {
        margin-top: 12px;
    }

    .brand-arcs {
        right: -180px;
        bottom: -308px;
    }

    .login-panel {
        min-height: calc(100vh - 255px);
    }
}

@media (max-width: 600px) {
    .login-panel,
    .dashboard-page {
        padding: 20px 16px;
    }

    .login-card,
    .dashboard-card {
        padding: 25px 23px;
        border-radius: 17px;
    }

    .brand-panel {
        min-height: 230px;
    }

    .brand-content {
        margin: 31px 24px;
    }

    .brand-kicker {
        margin-bottom: 20px;
    }

    .brand-copy h1 {
        font-size: clamp(38px, 12vw, 50px);
    }

    .brand-copy p {
        font-size: 15px;
    }

}

.portal-body {
    min-width: 320px;
    background: #f7f9fc;
    color: #13233f;
    font-size: 17px;
}

.portal-shell {
    display: grid;
    grid-template-columns: 272px minmax(0, 1fr);
    min-height: 100vh;
}

.portal-shell.is-sidebar-hidden {
    grid-template-columns: minmax(0, 1fr);
}

.portal-shell.is-sidebar-hidden .portal-sidebar {
    display: none;
}

.portal-sidebar {
    display: flex;
    position: sticky;
    top: 0;
    flex-direction: column;
    min-height: 100vh;
    padding: 28px 18px;
    background: #102b55;
    color: #fff;
}

.portal-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 10px 34px;
    color: #fff;
    font-size: 25px;
    font-weight: 800;
    letter-spacing: -.03em;
    text-decoration: none;
}

.portal-brand > span:last-child span { color: #76a7ff; }

.portal-brand-mark {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 12px;
    background: #2f70f4;
    font-size: 21px;
}

.primary-action,
.secondary-button,
.danger-button,
.text-button {
    display: inline-flex;
    width: auto;
    min-height: 48px;
    margin: 0;
    padding: 0 18px;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 10px;
    cursor: pointer;
    font: inherit;
    font-weight: 750;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
}

.primary-action { background: #2563eb; color: #fff; }
.primary-action:hover { background: #1d4ed8; }
.danger-button { background: #b42318; color: #fff; }
.danger-button:hover { background: #912018; }
.text-button-danger { color: #b42318 !important; }
.delete-confirm-card { max-width: 900px; }
.delete-warning { margin: 18px 0; padding: 18px; border: 1px solid #f2c6c3; border-radius: 12px; background: #fff7f6; color: #7a271a; }
.delete-warning strong { display: block; margin-bottom: 7px; color: #7a271a; }
.delete-warning p, .delete-explanation { margin: 0; line-height: 1.6; }
.delete-explanation { margin-top: 18px; color: #475569; }
.delete-confirm-actions { margin-top: 24px; }
.delete-confirm-actions form { margin: 0; }
.primary-action:focus-visible,
.secondary-button:focus-visible,
.danger-button:focus-visible,
.text-button:focus-visible,
.portal-nav a:focus-visible,
.portal-brand:focus-visible { outline: 3px solid #93c5fd; outline-offset: 3px; }
.primary-action[disabled], .secondary-button[disabled], .danger-button[disabled], .text-button[disabled] { cursor: not-allowed; opacity: .58; }

.portal-sidebar > .primary-action { margin: 0 8px 28px; background: #fff; color: #163b79; }

.portal-nav { display: grid; gap: 5px; }
.portal-nav a { padding: 13px 15px; border-radius: 9px; color: #d8e5fb; font-size: 16px; font-weight: 650; text-decoration: none; }
.portal-nav a:hover, .portal-nav a.is-active { background: #1e4780; color: #fff; }
.sidebar-context { margin: auto 10px 0; padding-top: 22px; border-top: 1px solid rgb(255 255 255 / 18%); color: #c7d8f4; font-size: 14px; line-height: 1.45; }

.portal-main { min-width: 0; }
.portal-topbar { display: flex; min-height: 82px; align-items: center; gap: 14px; padding: 14px clamp(18px, 2vw, 34px); border-bottom: 1px solid #e3eaf4; background: #fff; }
.sidebar-toggle { display: inline-flex; min-height: 40px; padding: 0 12px; align-items: center; gap: 8px; flex: 0 0 auto; border: 1px solid #cbd7e7; border-radius: 9px; background: #f8fafc; color: #173f78; cursor: pointer; font: inherit; font-size: 15px; font-weight: 750; }
.sidebar-toggle:hover { background: #eef4fd; }
.sidebar-toggle:focus-visible { outline: 3px solid #93c5fd; outline-offset: 3px; }
.sidebar-toggle-icon { font-size: 18px; line-height: 1; }
.global-search { flex: 1; max-width: 540px; }
.global-search input, .filter-bar input, .filter-bar select, .field-label select { width: 100%; min-height: 48px; padding: 0 15px; border: 1px solid #cbd7e7; border-radius: 9px; background: #f8fafc; color: #62728c; font: inherit; }
.portal-topbar .environment-badge { margin: 0; white-space: nowrap; }
.environment-control { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; }
.environment-badge.is-production { border-color: #fecaca; background: #fff1f2; color: #9f1239; }
.environment-badge.is-production > span { background: #dc2626; }
.environment-switcher { display: inline-flex; gap: 5px; padding: 3px; border: 1px solid #d8e2f0; border-radius: 10px; background: #f8fafc; }
.environment-switcher form { margin: 0; }
.environment-switch-button { min-height: 32px; padding: 0 9px; border: 0; border-radius: 7px; background: transparent; color: #475569; cursor: pointer; font: inherit; font-size: 12px; font-weight: 750; }
button.environment-switch-button:hover { background: #eaf1fb; }
.environment-switch-button.is-active { background: #dbeafe; color: #1d4ed8; }
.environment-switch-button.is-current { display: inline-flex; align-items: center; gap: 5px; cursor: default; white-space: nowrap; }
.environment-switch-button.is-current small { padding-left: 2px; color: currentColor; font-size: 9px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; opacity: .72; }
.environment-switch-button.is-production:not(.is-active) { color: #9f1239; }
.environment-switch-button.is-production.is-active { background: #fee2e2; color: #991b1b; }
.environment-switch-button.is-unavailable { display: inline-flex; align-items: center; cursor: default; opacity: .42; }
.production-notice { border-color: #fecaca; background: #fff1f2; color: #881337; }

.environment-confirm-card { max-width: 820px; padding: 28px; }
.environment-confirm-card h1 { margin: 4px 0 18px; color: #0f2a4f; font-size: clamp(27px, 3vw, 34px); }
.environment-confirm-card > p { color: #475569; line-height: 1.6; }
.environment-confirm-list { margin: 20px 0 0; padding-left: 22px; color: #334155; line-height: 1.7; }
.environment-confirm-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 26px; }
.environment-confirm-actions form { margin: 0; }
.production-action { background: #b91c1c; }
.production-action:hover { background: #991b1b; }

.topbar-context-filter { display: grid; min-width: 230px; max-width: 430px; grid-template-columns: minmax(180px, 1fr) auto; align-items: end; gap: 8px; margin: 0; }
.topbar-context-filter label { display: grid; gap: 4px; color: #64748b; font-size: 11px; font-weight: 700; }
.topbar-context-filter select { width: 100%; min-height: 40px; padding: 0 10px; border: 1px solid #cbd7e7; border-radius: 9px; background: #f8fafc; color: #24364f; font: inherit; font-size: 13px; }
.topbar-context-filter > .secondary-button { width: auto; min-height: 40px; margin: 0; padding: 0 13px; }
.user-summary { min-width: 160px; max-width: 220px; text-align: right; }
.user-summary strong, .user-summary span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-summary strong { font-size: 15px; }
.user-summary span { color: #64748b; font-size: 12px; }
.logout-form { margin-left: 2px; }
.topbar-logout { min-height: 40px; border: 0; cursor: pointer; font: inherit; }

.portal-content { width: 100%; max-width: none; margin: 0; padding: 26px clamp(18px, 2vw, 34px) 52px; }
.sync-notice { margin-bottom: 28px; padding: 16px 18px; border: 1px solid #bed2f7; border-radius: 12px; background: #eff6ff; color: #254676; font-size: 15px; line-height: 1.5; }
.context-scope-notice { margin: -16px 0 28px; padding: 13px 18px; border-left: 4px solid #4d79ce; border-radius: 8px; background: #f5f8fd; color: #405a7f; font-size: 14px; line-height: 1.5; }
.page-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 28px; }
.page-heading h1 { margin: 2px 0 8px; color: #0f2a4f; font-size: clamp(29px, 3.4vw, 38px); letter-spacing: -.035em; }
.page-heading p:not(.eyebrow) { margin: 0; color: #60718d; line-height: 1.5; }
.eyebrow { margin: 0; color: #2563eb; font-size: 14px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }

.metric-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 28px; }
.metric-grid article, .content-card, .folder-card { border: 1px solid #e0e8f2; border-radius: 16px; background: #fff; box-shadow: 0 8px 24px rgb(22 52 95 / 5%); }
.metric-grid article { padding: 22px; }
.metric-grid span, .metric-grid small { display: block; color: #63728a; font-size: 14px; }
.metric-grid strong { display: block; margin: 10px 0 4px; color: #123361; font-size: 36px; }
.content-card { padding: 25px; }
.card-heading, .filter-bar { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.card-heading h2, .folder-card h2, .wizard-card h2 { margin: 0; color: #15335e; font-size: 23px; }
.card-heading p, .folder-card p, .wizard-card > p { margin: 7px 0 0; color: #64748b; font-size: 15px; line-height: 1.5; }
.card-heading a, .text-button { color: #1d4ed8; background: transparent; }
.text-button { min-height: 42px; padding: 0 8px; }
.data-table th:last-child, .data-table td:last-child { min-width: 240px; width: 260px; }
.table-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; white-space: normal; }
.table-actions form { display: inline-flex; width: auto; margin: 0; }
.table-actions .text-button { width: auto; min-height: 36px; margin: 0; padding: 0 10px; border-radius: 8px; }
.table-actions form .text-button { cursor: pointer; }

.table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.data-table { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 15px; }
.data-table th { padding: 13px 12px; color: #63728a; font-size: 12px; letter-spacing: .02em; text-align: left; text-transform: uppercase; }
.table-sort { width: auto; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: inherit; font: inherit; font-size: inherit; font-weight: inherit; letter-spacing: inherit; text-transform: inherit; }
.table-sort:hover { background: transparent; color: #1d4ed8; text-decoration: underline; }
.data-table td { padding: 18px 12px; border-top: 1px solid #e8eef6; color: #334155; vertical-align: middle; }
.data-table td strong, .data-table td small { display: block; }
.data-table td strong { color: #16345d; }
.data-table td small { margin-top: 4px; color: #7b899f; font-size: 12px; }
.documents-table th:first-child,
.documents-table td:first-child { width: auto; min-width: 250px; }
.documents-table th:nth-child(2),
.documents-table td:nth-child(2) { width: 110px; }
.documents-table th:nth-child(3),
.documents-table td:nth-child(3) { width: 105px; }
.documents-table th:nth-child(4),
.documents-table td:nth-child(4) { width: 100px; }
.documents-table th:nth-child(5),
.documents-table td:nth-child(5),
.documents-table th:nth-child(6),
.documents-table td:nth-child(6) { width: 125px; }
.documents-table th:last-child,
.documents-table td:last-child { min-width: 190px; width: 210px; }

.table-summary { margin: 16px 0 8px; color: #60718d; font-size: 14px; }
.pagination { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: 20px; }
.is-disabled { opacity: .55; pointer-events: none; }
.status-badge { display: inline-flex; width: max-content; max-width: 100%; padding: 6px 10px; border-radius: 999px; font-size: 13px; font-weight: 800; white-space: nowrap; }
.status-pending { background: #fff7d6; color: #8a5b00; }
.status-success { background: #e8f7ee; color: #146c3a; }
.status-danger { background: #fff0f0; color: #a12626; }
.status-active { background: #edf7ff; color: #185a8d; }
.status-inactive { background: #eef1f5; color: #5b6677; }
.filter-bar { align-items: center; }
.filter-bar label { width: min(100%, 340px); }
.document-filter-bar { justify-content: flex-start; align-items: end; }
.document-filter-bar .document-search-field { flex: 1 1 360px; max-width: 520px; }
.document-filter-bar .filter-select-field { display: grid; width: min(100%, 210px); gap: 5px; color: #60718d; font-size: 13px; font-weight: 700; }
.table-sort [data-sort-indicator] { display: inline-block; min-width: 1em; margin-left: 4px; color: #7b899f; text-decoration: none; }
.send-context-summary { display: grid; gap: 3px; margin: 0 0 20px; }
.send-context-summary span { color: #60718d; font-size: 13px; }
.filter-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
.filter-tabs button { min-height: 40px; padding: 0 12px; border: 1px solid #d5dfed; border-radius: 999px; background: #fff; color: #52647f; font: inherit; font-size: 14px; }
.filter-tabs .is-active { border-color: #2563eb; background: #eff6ff; color: #1d4ed8; }

.folder-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.folder-card { padding: 24px; }
.folder-icon { display: inline-grid; width: 46px; height: 40px; place-items: center; margin-bottom: 20px; border-radius: 8px; background: #e7efff; color: #245fd7; font-size: 24px; }
.folder-card small { display: block; margin: 12px 0; color: #718198; font-size: 13px; }
.button-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.permissions-page { max-width: 100%; }
.permission-page-heading { margin-bottom: 16px; }
.permission-page-heading h1 { margin-bottom: 4px; font-size: clamp(28px, 3vw, 36px); }
.permission-page-heading p:not(.eyebrow) { max-width: 760px; line-height: 1.4; }
.permission-category-card { margin-bottom: 0; padding: 20px 24px; }
.permission-category-card .card-heading { margin-bottom: 10px; }
.permission-category-card .card-heading h2 { font-size: 21px; }
.permission-category-card .card-heading p { margin-top: 4px; line-height: 1.4; }
.permission-table { min-width: 640px; }
.permission-table th:last-child, .permission-table td:last-child { min-width: 180px; width: 200px; }
.permission-category-card .permission-table th { padding-top: 10px; padding-bottom: 10px; }
.permission-category-card .permission-table td { padding-top: 14px; padding-bottom: 14px; }
.permission-empty-state { min-height: 160px; box-shadow: none; border: 0; padding: 8px; }
.secondary-button { padding: 0 19px; background: #e8effa; color: #1e4889; }
.empty-state { min-height: 290px; display: grid; place-content: center; text-align: center; }
.empty-state > span { margin-bottom: 12px; color: #5a8dee; font-size: 42px; }
.empty-state h2 { margin: 0; color: #173760; }
.empty-state p { max-width: 620px; margin: 10px 0 0; color: #64748b; line-height: 1.55; }
.connection-card { display: grid; gap: 18px; margin-bottom: 22px; }
.connection-card h2 { margin: 5px 0 8px; color: #173760; font-size: 24px; }
.connection-card p:not(.eyebrow) { margin: 0; color: #64748b; line-height: 1.55; }
.connection-status { padding: 13px 15px; border-radius: 10px; background: #edf6ff; color: #174b85 !important; font-weight: 700; }

.monitoring-heading { margin-bottom: 20px; }
.monitoring-card { margin-bottom: 22px; }
.monitoring-card-heading { margin-bottom: 16px; }
.monitoring-card-heading h2 { margin: 4px 0 6px; color: #173760; font-size: 23px; }
.monitoring-card-heading p:not(.eyebrow) { max-width: 900px; margin: 0; color: #64748b; line-height: 1.5; }
.monitoring-integration-list { display: grid; gap: 12px; }
.monitoring-integration-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 16px; padding: 16px 0; border-top: 1px solid #e6edf6; }
.monitoring-integration-row:first-child { border-top: 0; }
.monitoring-integration-copy h3 { margin: 0 0 4px; color: #173760; font-size: 18px; }
.monitoring-integration-copy p { margin: 0; color: #64748b; font-size: 14px; line-height: 1.45; }
.integration-status { display: inline-flex; min-width: 92px; min-height: 34px; padding: 0 11px; align-items: center; justify-content: center; border-radius: 999px; font-size: 13px; font-weight: 800; white-space: nowrap; }
.integration-status-neutral { background: #eef2f7; color: #5b6677; }
.integration-status-success { background: #e8f7ee; color: #146c3a; }
.integration-status-error { background: #fff0f0; color: #a12626; }
.monitoring-action { min-width: 110px; min-height: 42px; }
.monitoring-feedback { margin: 0 0 4px; padding: 11px 13px; border-radius: 10px; font-size: 14px; font-weight: 700; line-height: 1.45; }
.monitoring-feedback-neutral { background: #f4f7fb; color: #52647f; }
.monitoring-feedback-success { background: #eaf7ef; color: #146c3a; }
.monitoring-feedback-warning { background: #fff8dc; color: #7a5600; }
.monitoring-feedback-error { background: #fff0f0; color: #9b2424; }
.monitoring-metrics { display: grid; grid-template-columns: minmax(150px, .7fr) minmax(220px, 1.5fr) minmax(220px, 1fr); gap: 12px; margin: 4px 0 16px; }
.monitoring-metrics > div { min-width: 0; padding: 14px 16px; border-radius: 12px; background: #f6f9fd; }
.monitoring-metrics span, .monitoring-metrics strong { display: block; }
.monitoring-metrics span { color: #64748b; font-size: 13px; font-weight: 700; }
.monitoring-metrics strong { margin-top: 5px; color: #173760; font-size: 16px; overflow-wrap: anywhere; }
.monitoring-help { margin: 0 0 14px; color: #60718d; font-size: 14px; line-height: 1.5; }
.monitoring-sync-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; }
.monitoring-sync-actions form { margin: 0; }
.monitoring-sync-actions p { max-width: 620px; margin: 0; color: #64748b; font-size: 13px; line-height: 1.45; }
.document-detail-card { margin-bottom: 22px; }
.detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0; }
.detail-grid div { min-height: 86px; padding: 16px; border-radius: 10px; background: #f5f8fd; }
.detail-grid dt { color: #63728a; font-size: 13px; font-weight: 700; }
.detail-grid dd { margin: 7px 0 0; color: #19375f; font-size: 15px; font-weight: 700; overflow-wrap: anywhere; }

.send-environment-banner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px 18px;
    align-items: center;
    margin: -6px 0 18px;
    padding: 12px 16px;
    border: 1px solid #cbdcf7;
    border-radius: 12px;
    background: #f5f9ff;
}
.send-environment-banner > div { display: flex; align-items: baseline; gap: 8px; white-space: nowrap; }
.send-environment-label { color: #64748b; font-size: 13px; font-weight: 800; text-transform: uppercase; }
.send-environment-banner strong { color: #1d4ed8; font-size: 14px; letter-spacing: .03em; }
.send-environment-banner p { margin: 0; color: #526985; font-size: 14px; line-height: 1.4; }
.send-environment-banner.is-production { border-color: #fecaca; background: #fff7f7; }
.send-environment-banner.is-production strong { color: #b42318; }

.send-stepper {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
}
.send-stepper li { position: relative; min-width: 0; }
.send-stepper li:not(:last-child)::after {
    content: "";
    position: absolute;
    z-index: 0;
    top: 24px;
    right: -1px;
    width: calc(100% - 48px);
    height: 2px;
    transform: translateX(50%);
    background: #dbe5f3;
}
.send-stepper li.is-complete:not(:last-child)::after { background: #7aa2ea; }
.send-stepper button {
    position: relative;
    z-index: 1;
    display: flex;
    width: 100%;
    min-height: 58px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 8px 12px;
    border: 0;
    background: transparent;
    color: #64748b;
    font: inherit;
    text-align: left;
}
.send-stepper button:not(:disabled) { cursor: pointer; }
.send-stepper button:disabled { cursor: default; opacity: .72; }
.send-step-number {
    display: inline-grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    border: 2px solid #cbd7e7;
    border-radius: 50%;
    background: #fff;
    color: #64748b;
    font-size: 14px;
    font-weight: 850;
}
.send-step-copy { display: grid; gap: 1px; min-width: 0; }
.send-step-copy strong { color: #52657f; font-size: 14px; }
.send-step-copy small { color: #8090a6; font-size: 12px; }
.send-step-mobile-copy { display: none; }
.send-stepper .is-current .send-step-number { border-color: #2563eb; background: #2563eb; color: #fff; }
.send-stepper .is-current .send-step-copy strong { color: #15335e; }
.send-stepper .is-complete .send-step-number { border-color: #5d8fe8; background: #eef5ff; color: transparent; }
.send-stepper .is-complete .send-step-number::after { content: "✓"; color: #1d4ed8; font-size: 16px; }

.wizard-card { width: 100%; max-width: none; }
.wizard-panel[hidden] { display: none !important; }
.wizard-panel-heading { margin-bottom: 20px; }
.wizard-panel-heading span { display: block; margin-bottom: 2px; color: #2563eb; font-size: 12px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.wizard-panel-heading h2 { margin: 0; color: #15335e; font-size: 23px; }
.wizard-panel-heading p { margin: 7px 0 0; color: #64748b; font-size: 15px; line-height: 1.5; }

.upload-zone {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 16px;
    align-items: center;
    margin: 18px 0 14px;
    padding: 14px 16px;
    border: 1px solid #cbdcf7;
    border-radius: 12px;
    background: #f8fbff;
    color: #567097;
    text-align: left;
}
.upload-zone-copy { display: grid; gap: 3px; min-width: 0; }
.upload-zone strong { color: #1d4ed8; font-size: 15px; }
.upload-zone-copy span { color: #64748b; font-size: 13px; }
.upload-zone input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.upload-zone .secondary-button { width: auto; margin: 0; cursor: pointer; white-space: nowrap; }
.upload-zone.has-files { background: #fff; }
.upload-opening,
.upload-feedback { grid-column: 1 / -1; }
.selected-files-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 4px 0 8px;
    color: #52657f;
    font-size: 13px;
}
.selected-files-heading strong { color: #16345d; font-size: 14px; }
.name-mode { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0 0 18px; padding: 14px; border: 1px solid #dbe5f3; border-radius: 10px; color: #334e73; font-size: 14px; }
.name-mode legend { padding: 0 5px; color: #163b79; font-weight: 800; }
.name-mode label { display: inline-flex; align-items: center; gap: 7px; }
.name-mode input { width: auto; min-height: auto; }
.name-mode .field-help { margin: 0; }
.ged-option { display: grid; gap: 14px; margin: 22px 0 0; padding: 14px; border: 1px solid #dbe5f3; border-radius: 10px; color: #334e73; font-size: 14px; }
.ged-option legend { padding: 0 5px; color: #163b79; font-weight: 800; }
.ged-option > label:first-of-type { font-weight: 700; }
.ged-option input[type="checkbox"] { width: auto; min-height: auto; }
.upload-opening { min-height: 20px; color: #476a9f; font-size: 13px; font-weight: 700; }
.selected-files { display: grid; gap: 8px; margin: 0 0 20px; }
.selected-file { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid #dbe5f3; border-radius: 9px; background: #f8fbff; }
.selected-file strong { overflow-wrap: anywhere; }
.selected-file-meta { display: grid; flex: 1; min-width: 0; gap: 3px; }
.selected-file-meta small { color: #718198; font-size: 12px; }
.selected-file input { flex: 1; min-height: 40px; padding: 0 10px; border: 1px solid #cbd7e7; border-radius: 8px; font: inherit; }
.selected-file .text-button { width: auto; min-height: 36px; }
.field-help { position: relative; display: inline-block; margin-left: 4px; font-weight: 400; vertical-align: middle; }
.field-help summary { display: inline-grid; width: 18px; height: 18px; place-items: center; border-radius: 50%; background: #e6efff; color: #1d4ed8; cursor: pointer; font-size: 12px; font-weight: 800; list-style: none; }
.field-help summary::-webkit-details-marker { display: none; }
.field-help span { position: absolute; z-index: 3; top: 24px; left: 0; width: 250px; padding: 10px; border: 1px solid #bcd0f4; border-radius: 8px; background: #fff; box-shadow: 0 8px 18px rgb(22 52 95 / 15%); color: #334e73; font-size: 13px; line-height: 1.35; }
.field-label { display: grid; gap: 8px; color: #304968; font-size: 15px; font-weight: 750; }
.field-label input { width: 100%; min-height: 48px; padding: 0 15px; border: 1px solid #cbd7e7; border-radius: 9px; background: #f8fafc; color: #24364f; font: inherit; }
.field-label input:disabled { cursor: not-allowed; background: #eef2f7; color: #8a98ac; }
.inline-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 14px; }
.form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 22px 0; }
.choice-line { display: inline-flex; min-width: 0; align-items: center; gap: 7px; }
.choice-line input[type="checkbox"],
.choice-line input[type="radio"] { width: auto; min-height: auto; flex: 0 0 auto; }
.choice-line:last-child .field-help span { right: 0; left: auto; }
.notification-options { display: flex; flex-wrap: wrap; gap: 18px; margin: 22px 0 0; padding: 14px; border: 1px solid #dbe5f3; border-radius: 10px; color: #334e73; font-size: 14px; }
.notification-options legend { padding: 0 5px; color: #163b79; font-weight: 800; }
.upload-feedback { color: #8a4b08; font-size: 13px; font-weight: 700; }
.page-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; }
.page-actions form { margin: 0; }
.field-label input:focus-visible,
.field-label select:focus-visible,
.topbar-context-filter select:focus-visible,
.filter-bar input:focus-visible, .filter-bar select:focus-visible { outline: 3px solid rgb(37 99 235 / 18%); outline-offset: 1px; border-color: #4f7fe7; }
.wizard-actions { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 28px; }
.review-environment-notice {
    display: flex;
    align-items: center;
    gap: 10px 14px;
    margin-bottom: 18px;
    padding: 12px 14px;
    border: 1px solid #cbdcf7;
    border-radius: 10px;
    background: #f5f9ff;
    color: #52657f;
    font-size: 14px;
}
.review-environment-notice strong { color: #1d4ed8; font-size: 13px; letter-spacing: .03em; }
.review-environment-notice.is-production { border-color: #fecaca; background: #fff7f7; }
.review-environment-notice.is-production strong { color: #b42318; }
.send-review-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.send-review-card {
    min-width: 0;
    padding: 16px;
    border: 1px solid #dfe7f2;
    border-radius: 12px;
    background: #fbfdff;
}
.send-review-card:last-child { grid-column: 1 / -1; }
.send-review-card h3 { margin: 0 0 12px; color: #15335e; font-size: 17px; }
.send-review-list { display: grid; gap: 10px; margin: 0; }
.send-review-list > div { display: grid; grid-template-columns: minmax(125px, .45fr) minmax(0, 1fr); gap: 10px; }
.send-review-list dt { color: #64748b; font-size: 13px; font-weight: 800; }
.send-review-list dd { min-width: 0; margin: 0; color: #334155; overflow-wrap: anywhere; }
.send-review-items { display: grid; gap: 5px; margin: 0; padding-left: 18px; color: #334155; }
.production-submit { background: #b42318; }
.production-submit:hover { background: #8f1d14; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

@media (max-width: 1100px) {
    .portal-shell { grid-template-columns: 1fr; }
    .portal-sidebar { position: static; min-height: auto; padding: 18px; }
    .portal-brand { margin: 0 6px 16px; }
    .portal-sidebar > .primary-action { margin-bottom: 16px; }
    .portal-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .portal-nav a { padding: 11px; font-size: 14px; text-align: center; }
    .sidebar-context { display: none; }
    .folder-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
    .documents-table,
    .documents-table tbody,
    .documents-table tr,
    .documents-table td {
        display: block;
        width: 100%;
    }

    .documents-table {
        min-width: 0;
    }

    .documents-table thead {
        display: none;
    }

    .documents-table tbody {
        display: grid;
        gap: 12px;
    }

    .documents-table tr {
        padding: 14px 0;
        border-top: 1px solid #e8eef6;
    }

    .documents-table tr:first-child {
        border-top: 0;
    }

    .documents-table td {
        display: grid;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        grid-template-columns: minmax(118px, 34%) minmax(0, 1fr);
        gap: 10px;
        padding: 6px 0;
        border-top: 0;
        overflow-wrap: anywhere;
    }

    .documents-table td::before {
        content: attr(data-label);
        color: #63728a;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: .02em;
        text-transform: uppercase;
    }

    .documents-table td:first-child {
        display: block;
        width: 100% !important;
        padding-bottom: 10px;
    }

    .documents-table td:first-child::before,
    .documents-table td:last-child::before {
        display: none;
    }

    .documents-table td:last-child {
        display: block;
        width: 100% !important;
        padding-top: 10px;
    }

    .documents-table .table-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        justify-content: stretch;
        gap: 8px;
    }

    .documents-table .table-actions > *,
    .documents-table .table-actions form,
    .documents-table .table-actions .text-button {
        width: 100%;
    }

    .documents-table .table-actions .text-button {
        min-height: 40px;
        border: 1px solid #d8e2f0;
        background: #f8fafc;
    }

    .documents-table .table-actions > :last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }
}

@media (max-width: 820px) {
    .portal-topbar {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        gap: 10px 12px;
    }

    .sidebar-toggle {
        grid-column: 1;
        grid-row: 1;
        justify-self: start;
    }

    .environment-control {
        grid-column: 2;
        grid-row: 1;
        min-width: 0;
        flex-wrap: wrap;
        justify-self: start;
    }

    .portal-topbar .environment-badge {
        justify-self: start;
    }

    .logout-form {
        grid-column: 3;
        grid-row: 1;
        margin: 0;
    }

    .user-summary {
        grid-column: 1 / -1;
        min-width: 0;
        text-align: left;
    }

    .topbar-context-filter {
        grid-column: 1 / -1;
        width: 100%;
        min-width: 0;
        max-width: none;
    }

    .page-heading,
    .card-heading,
    .filter-bar {
        align-items: stretch;
        flex-direction: column;
    }

    .page-heading > .primary-action,
    .page-heading > .secondary-button,
    .page-heading > .button-row,
    .page-heading > .page-actions {
        width: 100%;
    }

    .page-heading > .button-row > * {
        flex: 1 1 auto;
    }

    .page-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .page-actions > *,
    .page-actions > a,
    .page-actions form,
    .page-actions form > .primary-action,
    .page-actions form > .secondary-button {
        width: 100%;
    }

    .metric-grid,
    .folder-grid {
        grid-template-columns: 1fr;
    }

    .detail-grid,
    .form-grid {
        grid-template-columns: 1fr;
    }

    .name-mode {
        grid-template-columns: 1fr;
    }

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

    .content-card {
        padding: 18px;
    }

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

    .monitoring-integration-row form {
        grid-column: 1 / -1;
    }

    .monitoring-integration-row form .monitoring-action {
        width: 100%;
    }

    .monitoring-metrics {
        grid-template-columns: 1fr;
    }

    .monitoring-sync-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .monitoring-sync-actions form,
    .monitoring-sync-actions form .primary-action {
        width: 100%;
    }

    .wizard-actions {
        flex-direction: column-reverse;
    }

    .wizard-actions > * {
        width: 100%;
    }

    .selected-file {
        align-items: stretch;
        flex-direction: column;
    }

    .selected-file .text-button {
        align-self: flex-end;
    }

    .table-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .table-actions > *,
    .table-actions form,
    .table-actions .text-button {
        width: 100%;
    }

    .field-help[open] {
        display: block;
        width: 100%;
        margin: 6px 0 0;
    }

    .field-help[open] span {
        position: static;
        display: block;
        width: 100%;
        max-width: none;
        margin-top: 6px;
        box-shadow: none;
    }
}

@media (max-width: 980px) {
    .documents-table {
        max-width: 100%;
    }
}

@media (max-width: 620px) {
    .documents-table td:not(:first-child):not(:last-child) {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .documents-table td::before {
        margin-bottom: 1px;
    }

    .documents-table td:first-child strong {
        line-height: 1.35;
    }
}

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

    .documents-table .table-actions > :last-child:nth-child(odd) {
        grid-column: auto;
    }
}

@media (max-width: 520px) {
    .sidebar-toggle {
        padding: 0 10px;
        font-size: 14px;
    }

    .portal-topbar,
    .portal-content {
        padding-left: 16px;
        padding-right: 16px;
    }

    .portal-sidebar {
        padding: 14px 12px;
    }

    .portal-nav {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .portal-nav a {
        padding: 10px 8px;
        font-size: 15px;
    }

    .topbar-context-filter {
        grid-template-columns: 1fr;
    }

    .topbar-context-filter > .secondary-button {
        width: 100%;
    }

    .page-heading h1 {
        font-size: clamp(28px, 10vw, 36px);
    }

    .send-environment-banner {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .send-environment-banner > div {
        white-space: normal;
    }

    .send-stepper {
        grid-template-columns: 1fr;
    }

    .send-stepper li {
        display: none;
    }

    .send-stepper li.is-current {
        display: block;
    }

    .send-stepper li::after {
        display: none;
    }

    .send-stepper button {
        justify-content: flex-start;
        padding: 8px 0;
    }

    .send-step-desktop-copy {
        display: none;
    }

    .send-step-mobile-copy {
        display: block;
    }

    .upload-zone {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .upload-zone .secondary-button {
        width: 100%;
    }

    .selected-files-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 2px;
    }

    .send-review-grid {
        grid-template-columns: 1fr;
    }

    .send-review-card:last-child {
        grid-column: auto;
    }

    .send-review-list > div {
        grid-template-columns: 1fr;
        gap: 3px;
    }

    .wizard-actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .wizard-actions > * {
        width: 100%;
    }

    .notification-options {
        display: grid;
        gap: 12px;
    }

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

    .button-row > * {
        width: 100%;
    }

    .pagination > * {
        flex: 1 1 0;
    }
}


/* R3A — Contatos, grupos e seleção de assinantes */
.address-book-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 18px;
}

.address-book-section {
    margin-top: 18px;
}

.address-book-form,
.contact-row-form,
.group-name-form,
.group-member-form {
    display: grid;
    gap: 12px;
}

.address-book-form .field-label,
.group-member-form .field-label,
.group-name-form .field-label {
    display: grid;
    gap: 6px;
}

.address-book-form .field-label small {
    color: #718198;
    font-weight: 500;
}

.contact-row-form {
    grid-template-columns: minmax(160px, 1.2fr) minmax(190px, 1.4fr) minmax(130px, .8fr) auto;
    align-items: center;
}

.contact-row-form input,
.group-name-form input,
.group-member-form select {
    width: 100%;
    min-height: 42px;
    padding: 0 12px;
    border: 1px solid #cbd7e7;
    border-radius: 9px;
    background: #f8fafc;
    color: #334155;
    font: inherit;
}

.address-book-table {
    min-width: 760px;
}

.address-book-table td {
    padding: 12px;
}

.group-list {
    display: grid;
    gap: 14px;
}

.group-card {
    padding: 18px;
    border: 1px solid #dfe7f2;
    border-radius: 12px;
    background: #fbfdff;
}

.group-name-form {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
}

.member-list {
    display: grid;
    gap: 8px;
    margin: 14px 0;
    padding: 0;
    list-style: none;
}

.member-list li {
    display: grid;
    grid-template-columns: minmax(140px, .8fr) minmax(180px, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 10px 12px;
    border-radius: 9px;
    background: #fff;
    color: #475569;
}

.member-list strong {
    color: #16345d;
}

.member-list small,
.muted-copy {
    color: #718198;
}

.group-member-form {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    margin-top: 14px;
}

.compact-empty-state {
    min-height: 130px;
    padding: 16px;
}

.address-book-feedback {
    margin-bottom: 18px;
}

.signer-selector {
    display: grid;
    gap: 16px;
    margin: 22px 0;
    padding: 18px;
    border: 1px solid #dbe5f3;
    border-radius: 12px;
    background: #fbfdff;
}

.signer-selector > legend {
    padding: 0 6px;
    color: #163b79;
    font-weight: 800;
}

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

.signer-source-card {
    display: grid;
    gap: 8px;
    padding: 14px;
    border: 1px solid #e0e8f2;
    border-radius: 10px;
    background: #fff;
}

.signer-source-card h3 {
    margin: 0;
    color: #15335e;
    font-size: 16px;
}

.signer-source-card p {
    margin: 0;
    color: #64748b;
    font-size: 13px;
    line-height: 1.4;
}

.signer-source-state {
    display: grid;
    align-content: start;
    gap: 8px;
    min-height: 104px;
}

.signer-source-state p strong {
    color: #334155;
    font-size: 14px;
}

.signer-source-state .secondary-button {
    justify-self: start;
    margin-top: 2px;
}

.signer-source-state.is-error {
    padding: 10px;
    border: 1px solid #f1c7c7;
    border-radius: 8px;
    background: #fff8f8;
}

.compact-empty-state .secondary-button {
    justify-self: center;
    margin-top: 12px;
}

.signer-source-card input,
.signer-source-card select,
.selected-signer-row input {
    width: 100%;
    min-height: 42px;
    padding: 0 11px;
    border: 1px solid #cbd7e7;
    border-radius: 8px;
    background: #fff;
    color: #334155;
    font: inherit;
}

.selected-signers {
    display: grid;
    gap: 8px;
}

.selected-signers-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.selected-signers-heading h3 {
    margin: 0;
    color: #15335e;
    font-size: 17px;
}

.selected-signer-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
}

.selected-signer-row .secondary-button {
    min-height: 42px;
}

.signer-empty {
    margin: 0;
    padding: 12px;
    border: 1px dashed #cbd7e7;
    border-radius: 9px;
    color: #64748b;
    font-size: 14px;
}

.signer-feedback {
    margin: 0;
    color: #8a4b08;
    font-size: 13px;
    font-weight: 700;
}

@media (max-width: 900px) {
    .address-book-grid,
    .signer-source-grid {
        grid-template-columns: 1fr;
    }

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

    .group-name-form,
    .group-member-form {
        grid-template-columns: 1fr;
    }

    .member-list li {
        grid-template-columns: 1fr;
        gap: 3px;
    }
}

@media (max-width: 520px) {
    .selected-signer-row {
        grid-template-columns: 1fr;
    }

    .selected-signer-row .secondary-button {
        width: 100%;
    }
}


/* R3J — gestão de contatos e grupos */
.address-book-heading {
    align-items: center;
}

.record-count {
    color: #64748b;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}

.address-book-filters {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(150px, 190px) auto;
    gap: 12px;
    align-items: end;
    margin: 14px 0 18px;
    padding: 14px;
    border: 1px solid #dfe7f2;
    border-radius: 10px;
    background: #f8fafc;
}

.address-book-filters label {
    display: grid;
    gap: 5px;
    color: #60718d;
    font-size: 13px;
    font-weight: 700;
}

.address-book-filters input,
.address-book-filters select {
    width: 100%;
    min-height: 42px;
    padding: 0 11px;
    border: 1px solid #cbd7e7;
    border-radius: 8px;
    background: #fff;
    color: #334155;
    font: inherit;
}

.filter-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
}

.text-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #1d4ed8;
    font: inherit;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.text-action:hover,
.text-action:focus-visible {
    text-decoration: underline;
}

.danger-action {
    color: #b42318;
}

.address-book-records {
    display: grid;
    gap: 12px;
}

.contact-management-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    padding: 14px;
    border: 1px solid #dfe7f2;
    border-radius: 11px;
    background: #fbfdff;
}

.contact-editor {
    display: grid;
    grid-template-columns: minmax(150px, 1.1fr) minmax(190px, 1.3fr) minmax(130px, .8fr) auto;
    gap: 10px;
    align-items: end;
}

.contact-editor label {
    display: grid;
    gap: 5px;
    color: #60718d;
    font-size: 13px;
    font-weight: 700;
}

.contact-editor label small {
    font-weight: 500;
}

.contact-editor input {
    width: 100%;
    min-height: 42px;
    padding: 0 11px;
    border: 1px solid #cbd7e7;
    border-radius: 8px;
    background: #fff;
    color: #334155;
    font: inherit;
}

.record-status-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.record-status-actions form {
    margin: 0;
}

.group-management-card {
    display: grid;
    gap: 14px;
}

.group-management-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: end;
}

.group-members-heading {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding-top: 4px;
    border-top: 1px solid #e5ebf3;
}

.group-members-heading h3 {
    margin: 0 0 3px;
    color: #15335e;
    font-size: 16px;
}

.group-members-heading p {
    margin: 0;
    color: #64748b;
    font-size: 13px;
}

.managed-member-list li {
    grid-template-columns: minmax(180px, 1fr) auto auto;
}

.member-identification {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.member-identification span {
    overflow-wrap: anywhere;
}

.managed-member-list form {
    margin: 0;
}

@media (max-width: 1100px) {
    .contact-management-card,
    .group-management-heading {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .record-status-actions {
        justify-content: flex-start;
    }

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

@media (max-width: 760px) {
    .address-book-filters,
    .contact-editor,
    .managed-member-list li {
        grid-template-columns: 1fr;
    }

    .filter-actions,
    .record-status-actions {
        justify-content: flex-start;
    }

    .contact-editor .secondary-button,
    .group-member-form .secondary-button {
        width: 100%;
    }
}


@media (max-width: 900px) {
    .managed-member-list li {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .managed-member-list .status-badge {
        margin-top: 4px;
    }
}


/* R3M — erro controlado e código de suporte */
.application-error-body {
    min-height: 100vh;
    margin: 0;
    background: #f4f7fb;
    color: #24364f;
}

.application-error-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 28px;
}

.application-error-card {
    width: min(100%, 680px);
    padding: 34px;
    border: 1px solid #dfe7f2;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 18px 55px rgba(23, 50, 87, .10);
}

.application-error-card h1 {
    margin: 6px 0 12px;
    color: #173257;
    font-size: clamp(26px, 4vw, 36px);
    line-height: 1.15;
}

.application-error-card > p:not(.eyebrow) {
    margin: 0;
    color: #5f6f85;
    line-height: 1.65;
}

.application-support-code {
    display: grid;
    gap: 6px;
    margin: 24px 0;
    padding: 14px 16px;
    border: 1px solid #dbe5f3;
    border-radius: 10px;
    background: #f8fafc;
}

.application-support-code span {
    color: #64748b;
    font-size: 13px;
    font-weight: 700;
}

.application-support-code strong {
    overflow-wrap: anywhere;
    color: #173257;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 15px;
}

.application-error-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

@media (max-width: 560px) {
    .application-error-page {
        padding: 16px;
    }

    .application-error-card {
        padding: 24px 20px;
    }

    .application-error-actions > * {
        width: 100%;
    }
}


/* R3N5 — documentação interna */
.documentation-page {
    display: grid;
    gap: 22px;
}

.documentation-heading {
    align-items: center;
}

.documentation-version {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid #d8e2f0;
    border-radius: 999px;
    background: #f8fafc;
    color: #475569;
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
}

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

.documentation-index-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    padding: 18px;
    border: 1px solid #dbe5f3;
    border-radius: 12px;
    background: #fff;
    color: inherit;
    text-decoration: none;
    box-shadow: 0 8px 22px rgb(15 23 42 / 5%);
}

.documentation-index-card:hover,
.documentation-index-card:focus-visible {
    border-color: #a9c4ef;
    box-shadow: 0 10px 26px rgb(37 99 235 / 9%);
}

.documentation-index-icon {
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 10px;
    background: #eef5ff;
    color: #1d4ed8;
    font-size: 14px;
    font-weight: 900;
}

.documentation-index-card strong,
.documentation-index-card small {
    display: block;
}

.documentation-index-card strong {
    color: #16345d;
    font-size: 16px;
}

.documentation-index-card small {
    margin-top: 4px;
    color: #64748b;
    line-height: 1.45;
}

.documentation-section {
    display: grid;
    gap: 18px;
    scroll-margin-top: 20px;
}

.documentation-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    padding-top: 6px;
}

.documentation-section-heading h2 {
    margin: 0;
    color: #15335e;
    font-size: 26px;
}

.documentation-section-heading p:not(.eyebrow) {
    max-width: 780px;
    margin: 7px 0 0;
    color: #64748b;
    line-height: 1.55;
}

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

.documentation-card {
    min-width: 0;
}

.documentation-card-wide {
    grid-column: 1 / -1;
}

.documentation-card h3 {
    margin: 0 0 10px;
    color: #15335e;
    font-size: 19px;
}

.documentation-card h4 {
    margin: 0 0 8px;
    color: #24486f;
    font-size: 15px;
}

.documentation-card p {
    color: #5f6f85;
    line-height: 1.6;
}

.documentation-card ul,
.documentation-card ol {
    margin: 12px 0 0;
    padding-left: 20px;
    color: #475569;
    line-height: 1.6;
}

.documentation-card li + li {
    margin-top: 6px;
}

.documentation-step {
    display: inline-grid;
    width: 30px;
    height: 30px;
    margin-bottom: 12px;
    place-items: center;
    border-radius: 50%;
    background: #eef5ff;
    color: #1d4ed8;
    font-size: 13px;
    font-weight: 900;
}

.documentation-subgrid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 14px;
}

.documentation-subgrid > div {
    min-width: 0;
    padding: 15px;
    border: 1px solid #e1e9f4;
    border-radius: 10px;
    background: #fbfdff;
}

.documentation-table-wrap {
    width: 100%;
    margin-top: 14px;
    overflow-x: auto;
}

.documentation-table {
    min-width: 760px;
}

.documentation-table td {
    vertical-align: top;
}

.documentation-table code,
.documentation-note code,
.documentation-card code,
.documentation-callout code {
    overflow-wrap: anywhere;
    color: #163b79;
}

.documentation-callout {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 14px 16px;
    border: 1px solid #cbdcf7;
    border-radius: 10px;
    background: #f5f9ff;
    color: #52657f;
    line-height: 1.5;
}

.documentation-callout strong {
    flex: 0 0 auto;
    color: #1d4ed8;
}

.documentation-callout-warning {
    border-color: #f0d8aa;
    background: #fffaf0;
}

.documentation-callout-warning strong {
    color: #8a4b08;
}

.documentation-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 14px 0;
}

.documentation-facts > div {
    display: grid;
    gap: 4px;
    padding: 12px;
    border: 1px solid #e1e9f4;
    border-radius: 9px;
    background: #fbfdff;
}

.documentation-facts span {
    color: #718198;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.documentation-facts strong {
    color: #24486f;
    overflow-wrap: anywhere;
}

.documentation-code {
    margin: 14px 0 0;
    padding: 14px;
    overflow-x: auto;
    border: 1px solid #d9e3f0;
    border-radius: 9px;
    background: #f8fafc;
    color: #243b53;
    font: 13px/1.55 Consolas, "Courier New", monospace;
    white-space: pre-wrap;
}

.documentation-code-list {
    padding-left: 20px;
}

.documentation-code-list code {
    font: 13px/1.5 Consolas, "Courier New", monospace;
}

.documentation-note {
    margin: 12px 0 0;
    padding: 10px 12px;
    border-left: 3px solid #9cb9e8;
    background: #f8fbff;
    color: #5f6f85;
    font-size: 13px;
}

.documentation-procedure {
    counter-reset: documentation-procedure;
    display: grid;
    gap: 10px;
    padding-left: 0 !important;
    list-style: none;
}

.documentation-procedure li {
    position: relative;
    padding: 12px 12px 12px 46px;
    border: 1px solid #e1e9f4;
    border-radius: 9px;
    background: #fbfdff;
}

.documentation-procedure li::before {
    counter-increment: documentation-procedure;
    content: counter(documentation-procedure);
    position: absolute;
    top: 12px;
    left: 12px;
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border-radius: 50%;
    background: #eef5ff;
    color: #1d4ed8;
    font-size: 12px;
    font-weight: 900;
}

.documentation-technical {
    padding-top: 8px;
    border-top: 1px solid #e1e9f4;
}

@media (max-width: 900px) {
    .documentation-index,
    .documentation-grid,
    .documentation-subgrid,
    .documentation-facts {
        grid-template-columns: 1fr;
    }

    .documentation-section-heading {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 620px) {
    .documentation-heading {
        align-items: flex-start;
    }

    .documentation-version {
        align-self: flex-start;
    }

    .documentation-index-card {
        padding: 14px;
    }

    .documentation-callout {
        display: grid;
    }
}


.documentation-figure {
    margin: 0;
    padding: 16px;
    border: 1px solid #dbe5f3;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 8px 22px rgb(15 23 42 / 5%);
}

.documentation-figure img {
    display: block;
    width: 100%;
    height: auto;
}

.documentation-figure figcaption {
    margin-top: 10px;
    color: #64748b;
    font-size: 13px;
    line-height: 1.45;
}


/* R3.1.1 UX — navegação orientada à tarefa */
.portal-sidebar [hidden],
.portal-content [hidden] {
    display: none !important;
}

.sidebar-session {
    display: grid;
    gap: 12px;
    margin: 24px 8px 0;
    padding-top: 16px;
    border-top: 1px solid rgb(255 255 255 / 18%);
}

.sidebar-context-form,
.sidebar-logout-form {
    margin: 0;
}

.sidebar-context-form label,
.sidebar-context-summary,
.sidebar-user {
    display: grid;
    gap: 6px;
}

.sidebar-context-form label > span,
.sidebar-context-summary > span,
.sidebar-user > span {
    color: #9fb7dc;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.sidebar-context-form select {
    width: 100%;
    min-height: 42px;
    padding: 0 10px;
    border: 1px solid rgb(255 255 255 / 20%);
    border-radius: 8px;
    background: #173b70;
    color: #fff;
    font: inherit;
    font-size: 13px;
}

.sidebar-context-apply,
.sidebar-logout-form button {
    width: 100%;
    min-height: 38px;
    border: 1px solid rgb(255 255 255 / 20%);
    border-radius: 8px;
    background: transparent;
    color: #dce8fb;
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 750;
}

.sidebar-context-apply {
    margin-top: 8px;
}

.sidebar-context-apply:hover,
.sidebar-logout-form button:hover {
    background: #1e4780;
    color: #fff;
}

.sidebar-context-summary strong,
.sidebar-user strong {
    color: #fff;
    font-size: 13px;
    line-height: 1.4;
}

.portal-topbar {
    min-height: 58px;
    padding-block: 8px;
}

.page-heading-compact {
    margin-bottom: 18px;
}

.page-heading-compact h1 {
    margin-bottom: 6px;
}

.send-stepper {
    margin-bottom: 18px;
}

.wizard-panel-heading {
    margin-bottom: 16px;
}

.send-context-inline {
    display: flex;
    gap: 6px;
    margin: -2px 0 14px;
    color: #66758d;
    font-size: 14px;
    line-height: 1.45;
}

.send-context-inline strong {
    color: #264a7c;
    font-weight: 750;
}

.upload-zone-compact {
    margin-top: 4px;
}

.document-name-options {
    margin-top: 14px;
    border-top: 1px solid #e3eaf4;
    padding-top: 12px;
}

.document-name-options > summary {
    width: fit-content;
    cursor: pointer;
    color: #315b98;
    font-weight: 750;
}

.document-name-options .name-mode {
    margin-top: 14px;
}

.document-name-options .field-label {
    margin-top: 12px;
}

@media (max-width: 900px) {
    .portal-sidebar {
        overflow-y: auto;
    }

    .sidebar-session {
        margin-top: 24px;
    }
}


/* R3.1.2 UX — assistente de envio orientado à ação */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.signer-selector-compact {
    padding-top: 18px;
}

.signer-selector-compact > .signer-source-grid {
    margin-top: 0;
}

.send-advanced-options {
    margin-top: 18px;
    border: 1px solid #d8e3f2;
    border-radius: 12px;
    background: #fff;
}

.send-advanced-options > summary {
    padding: 16px 18px;
    cursor: pointer;
    color: #173f78;
    font-weight: 800;
    list-style-position: inside;
}

.send-advanced-options-body {
    padding: 0 18px 18px;
}

.send-options-row {
    display: grid;
    grid-template-columns:
        minmax(170px, 1.05fr)
        minmax(160px, .95fr)
        minmax(120px, .7fr)
        minmax(180px, 1fr);
    gap: 14px;
    align-items: end;
}

.send-option-cc {
    margin-top: 14px;
}

.send-advanced-options .ged-option,
.send-advanced-options .notification-options {
    margin-top: 16px;
}

.production-submit {
    background: #2563eb !important;
    color: #fff !important;
}

@media (min-width: 1280px) {
    .send-options-row {
        grid-template-columns:
            minmax(190px, 1.05fr)
            minmax(180px, .95fr)
            minmax(120px, .65fr)
            minmax(190px, 1fr);
    }

    .send-option-cc {
        margin-top: 14px;
    }
}

@media (max-width: 1050px) {
    .send-options-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .send-options-row {
        grid-template-columns: 1fr;
    }
}


/* R3.1.3 UX — sidebar adaptável à altura da viewport */
.portal-sidebar {
    min-height: 100vh;
    max-height: 100vh;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.portal-sidebar nav {
    flex: 0 0 auto;
}

.sidebar-session {
    flex: 0 0 auto;
    margin-top: 24px;
    padding-bottom: 18px;
}

.sidebar-user {
    margin-top: 2px;
}

.sidebar-logout-form {
    margin-top: -2px;
}

@media (max-height: 760px) and (min-width: 901px) {
    .portal-sidebar {
        padding-top: 14px;
        padding-bottom: 10px;
    }

    .portal-sidebar nav {
        gap: 4px;
    }

    .sidebar-session {
        gap: 9px;
        margin-top: 16px;
        padding-top: 12px;
        padding-bottom: 10px;
    }

    .sidebar-context-form select {
        min-height: 38px;
    }

    .sidebar-context-apply,
    .sidebar-logout-form button {
        min-height: 34px;
    }
}

@media (max-width: 900px) {
    .portal-sidebar {
        min-height: auto;
        max-height: 100dvh;
        overflow-y: auto;
    }

    .sidebar-session {
        margin-top: 18px;
        padding-bottom: 18px;
    }
}