/* SPIRA Design System — Fase 3 */
:root {
    --spira-navy-950: #071a33;
    --spira-navy-900: #0b2e66;
    --spira-navy-800: #123f7a;
    --spira-blue-600: #1769aa;
    --spira-blue-500: #2d83c5;
    --spira-teal-500: #18a6a1;
    --spira-teal-100: #e7f7f6;
    --spira-ink: #17253b;
    --spira-muted: #617086;
    --spira-surface: #ffffff;
    --spira-canvas: #f4f7fb;
    --spira-border: #d9e2ec;
    --spira-border-strong: #b9c9d8;
    --spira-success: #147d64;
    --spira-warning: #a86609;
    --spira-danger: #b42318;
    --spira-radius-sm: 8px;
    --spira-radius-md: 14px;
    --spira-radius-lg: 20px;
    --spira-shadow-sm: 0 2px 8px rgba(7, 26, 51, .06);
    --spira-shadow-md: 0 12px 30px rgba(7, 26, 51, .09);
    --spira-focus: 0 0 0 4px rgba(45, 131, 197, .24);
    --spira-motion: 160ms ease;
}

html { scroll-behavior: smooth; }
body { color: var(--spira-ink); background: var(--spira-canvas); }

.skip-link {
    position: fixed; left: 16px; top: -80px; z-index: 3000;
    padding: 12px 16px; border-radius: var(--spira-radius-sm);
    color: #fff; background: var(--spira-navy-950); font-weight: 700;
    transition: top var(--spira-motion);
}
.skip-link:focus { top: 16px; outline: none; box-shadow: var(--spira-focus); }

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: none; box-shadow: var(--spira-focus); border-color: var(--spira-blue-500);
}

.spira-shell .navbar, .spira-auth-page .navbar, .spira-admin-page .navbar {
    background: linear-gradient(110deg, var(--spira-navy-950), var(--spira-navy-900) 58%, var(--spira-blue-600));
    box-shadow: 0 4px 18px rgba(7, 26, 51, .18);
}
.spira-shell .navbar { position: sticky; }
.spira-shell .main-content { background: var(--spira-canvas); }
.spira-shell .v6-shell { background: var(--spira-canvas); }
.spira-shell .v6-sidebar { background: linear-gradient(180deg, var(--spira-navy-950), var(--spira-navy-900)); }
.spira-shell .v6-sidebar-nav .nav-item { border: 1px solid transparent; color: #e7eff8; }
.spira-shell .v6-sidebar-nav .nav-item:hover { background: rgba(255,255,255,.09); transform: translateX(0); border-color: rgba(255,255,255,.12); }
.spira-shell .v6-sidebar-nav .nav-item.active { background: linear-gradient(90deg, var(--spira-blue-600), var(--spira-blue-500)); box-shadow: 0 8px 16px rgba(23,105,170,.24); border-color: rgba(255,255,255,.12); }

.spira-shell .content-header, .spira-shell .welcome-message, .spira-shell .stat-card,
.spira-shell .card, .spira-shell .form-card, .spira-shell .panel {
    border: 1px solid var(--spira-border); border-radius: var(--spira-radius-md);
    box-shadow: var(--spira-shadow-sm);
}
.spira-shell .content-header, .spira-shell .welcome-message { background: var(--spira-surface); }
.spira-shell .content-header { border-left: 4px solid var(--spira-teal-500); }
.spira-shell .stat-card { transition: transform var(--spira-motion), box-shadow var(--spira-motion); }
.spira-shell .stat-card:hover { transform: translateY(-2px); box-shadow: var(--spira-shadow-md); }
.spira-shell .stat-card .stat-number { color: var(--spira-navy-900); }

:where(.form-control, .form-select, .form-textarea, input, select, textarea) {
    border: 1px solid var(--spira-border-strong); border-radius: var(--spira-radius-sm);
    min-height: 44px; color: var(--spira-ink); background: #fff;
    transition: border-color var(--spira-motion), box-shadow var(--spira-motion);
}
:where(.form-textarea, textarea) { min-height: 110px; resize: vertical; }
:where(.form-control, .form-select, .form-textarea, input, select, textarea)::placeholder { color: #7d8da0; }
:where(.form-control, .form-select, .form-textarea, input, select, textarea):hover { border-color: #8fa8bd; }

:where(.btn-primary, .btn-primary-action, .btn-submit, .btn-confirm, .btn-save, button[type="submit"]) {
    border: 0; border-radius: var(--spira-radius-sm); min-height: 44px; padding: 10px 18px;
    font-weight: 750; letter-spacing: .01em; cursor: pointer;
    background: linear-gradient(110deg, var(--spira-navy-900), var(--spira-blue-600));
    box-shadow: 0 5px 12px rgba(11,46,102,.16); transition: transform var(--spira-motion), box-shadow var(--spira-motion), filter var(--spira-motion);
}
:where(.btn-primary, .btn-primary-action, .btn-submit, .btn-confirm, .btn-save, button[type="submit"]):hover { transform: translateY(-1px); filter: brightness(1.06); box-shadow: 0 8px 18px rgba(11,46,102,.22); }
:where(.btn-secondary-action, .btn-secondary, .btn-cancel) { border-radius: var(--spira-radius-sm); min-height: 44px; }

.flash-messages { display: grid; gap: 10px; margin-bottom: 20px; }
.flash-message { border: 1px solid transparent; border-radius: var(--spira-radius-sm); padding: 12px 16px; font-weight: 600; }
.flash-message.success { color: var(--spira-success); background: #eaf8f3; border-color: #a9dec9; }
.flash-message.error { color: var(--spira-danger); background: #fff1f0; border-color: #f2b8b3; }
.flash-message.warning { color: var(--spira-warning); background: #fff8e8; border-color: #efd294; }

:where(table, .data-table) { border-collapse: separate; border-spacing: 0; overflow: hidden; border: 1px solid var(--spira-border); border-radius: var(--spira-radius-md); box-shadow: var(--spira-shadow-sm); background: #fff; }
:where(th, td) { padding: 13px 16px; border-bottom: 1px solid #edf1f5; text-align: left; }
:where(th) { color: var(--spira-navy-900); background: #f6f9fc; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; }
:where(tr:last-child td) { border-bottom: 0; }
:where(tbody tr:hover) { background: #f8fbfe; }

.empty-state { display: grid; place-items: center; min-height: 180px; padding: 28px; text-align: center; border: 1px dashed var(--spira-border-strong); border-radius: var(--spira-radius-md); background: rgba(255,255,255,.66); }
.empty-state strong { display: block; margin-bottom: 6px; color: var(--spira-navy-900); }
.empty-state p { max-width: 480px; margin: 0; color: var(--spira-muted); }

@media (max-width: 900px) {
    .spira-shell .main-content { padding: 24px 18px; }
    .spira-shell .v6-sidebar { width: 240px; }
    .spira-shell .navbar-container { padding: 0 1rem; }
}
@media (max-width: 640px) {
    .spira-shell .navbar-menu { gap: .25rem; }
    .spira-shell .admin-welcome { display: none; }
    .spira-shell .v6-sidebar { position: fixed; z-index: 1100; width: min(86vw, 300px); transform: translateX(-100%); transition: transform var(--spira-motion); }
    .spira-shell.mobile-sidebar-open .v6-sidebar { transform: translateX(0); }
    .spira-shell .main-content { padding: 18px 12px; }
    :where(.form-row, .form-grid, .actions, .button-group) { grid-template-columns: 1fr !important; flex-direction: column; align-items: stretch; }
    :where(.btn-primary, .btn-primary-action, .btn-secondary-action, .btn-secondary, .btn-submit, .btn-confirm, .btn-cancel) { width: 100%; }
    :where(.table-container, .data-table) { overflow-x: auto; display: block; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* ==========================================================
   PÁGINAS PÚBLICAS DE CONTA E DOCUMENTOS LEGAIS
   A versão Beta já usava .auth-page/.auth-card nos templates,
   mas esses seletores não possuíam tratamento visual próprio.
   ========================================================== */
.auth-page {
    min-height: 100vh;
    margin: 0;
    padding: clamp(28px, 5vw, 64px) 16px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    color: var(--spira-ink);
    background:
        radial-gradient(circle at 82% 12%, rgba(24, 166, 161, .16), transparent 28%),
        radial-gradient(circle at 12% 88%, rgba(45, 131, 197, .12), transparent 30%),
        linear-gradient(135deg, var(--spira-navy-950) 0%, var(--spira-navy-900) 58%, #0b667a 100%);
}

.auth-page *, .legal-page * { box-sizing: border-box; }

.auth-card {
    width: min(100%, 580px);
    margin: 0 auto;
    padding: clamp(26px, 4vw, 42px);
    border: 1px solid rgba(217, 226, 236, .95);
    border-radius: 20px;
    background: rgba(255, 255, 255, .985);
    box-shadow: 0 28px 75px rgba(7, 26, 51, .24);
}

.auth-card .brand {
    display: inline-flex;
    align-items: center;
    margin-bottom: 24px;
    color: var(--spira-navy-900);
    font-size: 1.12rem;
    font-weight: 850;
    letter-spacing: .14em;
    text-decoration: none;
}

.auth-card .brand::before {
    content: "";
    width: 12px;
    height: 12px;
    margin-right: 9px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--spira-teal-500), var(--spira-blue-500));
    box-shadow: 0 0 0 5px rgba(24, 166, 161, .10);
}

.auth-card h1 {
    margin: 0 0 8px;
    color: var(--spira-navy-950);
    font-size: clamp(1.7rem, 4vw, 2.15rem);
    line-height: 1.15;
    letter-spacing: -.025em;
}

.auth-card .muted {
    margin: 0 0 26px;
    color: var(--spira-muted);
    line-height: 1.55;
}

.auth-card form {
    display: grid;
    gap: 9px;
}

.auth-card form > label:not(.check) {
    margin-top: 7px;
    color: var(--spira-ink);
    font-size: .91rem;
    font-weight: 720;
}

.auth-card input:not([type="checkbox"]),
.auth-card select,
.auth-card textarea {
    width: 100%;
    padding: 11px 13px;
    border: 1px solid var(--spira-border-strong);
    border-radius: 9px;
    background: #fff;
    color: var(--spira-ink);
    font: inherit;
}

.auth-card input:not([type="checkbox"]):focus,
.auth-card select:focus,
.auth-card textarea:focus {
    border-color: var(--spira-blue-500);
    box-shadow: var(--spira-focus);
}

.auth-card .check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 8px;
    color: #42566c;
    font-size: .88rem;
    font-weight: 520;
    line-height: 1.45;
}

.auth-card .check input[type="checkbox"] {
    width: 18px;
    min-width: 18px;
    height: 18px;
    min-height: 0;
    margin: 2px 0 0;
    padding: 0;
    accent-color: var(--spira-teal-500);
    box-shadow: none;
}

.auth-card a { color: var(--spira-blue-600); }
.auth-card .check a { font-weight: 700; }

.auth-card .btn-primary,
.auth-card .btn-secondary {
    width: 100%;
    margin-top: 10px;
    justify-content: center;
    font-size: .96rem;
}

.auth-card .btn-primary { color: #fff; }

.auth-card .btn-secondary {
    border: 1px solid var(--spira-border-strong);
    background: #fff;
    color: var(--spira-navy-900);
    font-weight: 750;
    cursor: pointer;
}

.auth-card .btn-secondary:hover {
    border-color: var(--spira-blue-500);
    background: #f4f9fd;
}

.auth-card #formMessage,
.auth-card #resendMessage,
.auth-card #message,
.auth-card #feedback {
    min-height: 0;
    margin: 5px 0 0;
    font-size: .88rem;
    line-height: 1.45;
}
.auth-card :is(#formMessage, #resendMessage, #message, #feedback).success { color: var(--spira-success); }
.auth-card :is(#formMessage, #resendMessage, #message, #feedback).error { color: var(--spira-danger); }

.auth-card .auth-footer {
    margin: 22px 0 0;
    padding-top: 18px;
    border-top: 1px solid var(--spira-border);
    color: var(--spira-muted);
    font-size: .9rem;
    text-align: center;
}

.auth-card details.auth-footer { text-align: left; }
.auth-card details.auth-footer summary {
    cursor: pointer;
    color: var(--spira-navy-900);
    font-weight: 720;
}
.auth-card details.auth-footer[open] summary { margin-bottom: 14px; }

.legal-page {
    width: min(920px, calc(100% - 32px));
    margin: clamp(28px, 5vw, 64px) auto;
    padding: clamp(26px, 5vw, 48px);
    border: 1px solid var(--spira-border);
    border-radius: 20px;
    background: #fff;
    box-shadow: var(--spira-shadow-md);
    color: var(--spira-ink);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}
.legal-page > a:first-child {
    display: inline-block;
    margin-bottom: 22px;
    color: var(--spira-navy-900);
    font-weight: 850;
    letter-spacing: .12em;
    text-decoration: none;
}
.legal-page h1 { margin: 0 0 8px; color: var(--spira-navy-950); font-size: clamp(1.8rem, 4vw, 2.45rem); }
.legal-page h2 { margin: 30px 0 8px; color: var(--spira-navy-900); font-size: 1.15rem; }
.legal-page p { margin: 0 0 14px; color: #43566b; line-height: 1.72; }
.legal-page .muted { color: var(--spira-muted); font-size: .9rem; }

@media (max-width: 640px) {
    .auth-page { padding: 18px 12px; }
    .auth-card { padding: 24px 20px; border-radius: 16px; }
    .auth-card .brand { margin-bottom: 19px; }
    .legal-page { width: min(100% - 20px, 920px); margin: 10px auto; padding: 24px 20px; border-radius: 14px; }
}



/* ==========================================================
   SPIRA 14.0.3 — REFINAMENTO TIPOGRÁFICO, CROMÁTICO E DE DENSIDADE
   Objetivo: reduzir agressividade visual, retirar o azul do papel de
   cor universal e estabelecer uma escala tipográfica única para a
   aplicação interna. Ícones ficam fora desta rodada.
   ========================================================== */
:root {
    --spira-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    --spira-ink: #252b31;
    --spira-muted: #69737d;
    --spira-surface: #ffffff;
    --spira-canvas: #f5f6f7;
    --spira-border: #dfe3e6;
    --spira-border-strong: #c7ced4;
    --spira-teal-500: #2a7d78;
    --spira-teal-600: #216762;
    --spira-teal-100: #edf6f4;
    --spira-focus: 0 0 0 3px rgba(42, 125, 120, .18);
    --spira-shadow-sm: 0 1px 3px rgba(20, 30, 38, .045);
    --spira-shadow-md: 0 5px 14px rgba(20, 30, 38, .07);
    --spira-radius-md: 10px;
}

.spira-shell {
    font-family: var(--spira-font-family);
    font-size: 13px;
    color: var(--spira-ink);
}

/* A marca permanece azul-marinho; o azul deixa de dominar o restante da UI. */
.spira-shell .navbar {
    background: linear-gradient(110deg, #071a33, #0b2e52 72%, #123f58);
    box-shadow: 0 2px 8px rgba(7, 26, 51, .14);
}
.spira-shell .navbar-menu,
.spira-shell .admin-welcome,
.spira-shell .nav-link { font-size: 12px; }

.spira-shell .v6-sidebar {
    background: linear-gradient(180deg, #071a33, #0a2948);
}
.spira-shell .v6-sidebar-nav .nav-item {
    min-height: 40px;
    padding: 9px 11px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
}
.spira-shell .v6-sidebar-nav .nav-item:hover {
    background: rgba(255,255,255,.07);
    border-color: transparent;
}
.spira-shell .v6-sidebar-nav .nav-item.active {
    background: rgba(255,255,255,.10);
    color: #ffffff;
    border-color: transparent;
    border-left: 2px solid #5fc0b5;
    box-shadow: none;
    font-weight: 650;
}
.spira-shell .sidebar-title h3 {
    font-size: 13px;
    font-weight: 650;
    color: #eef3f6;
}
.spira-shell .sidebar-header span {
    background: rgba(255,255,255,.08);
    color: #c9d4dd;
    font-size: 10px;
}
.spira-shell .sidebar-toggle {
    background: rgba(255,255,255,.08);
    color: #dce6ec;
    border-color: rgba(255,255,255,.12);
    box-shadow: none;
}

/* Escala tipográfica interna: títulos discretos, conteúdo operacional dominante. */
.spira-shell .main-content h1,
.spira-shell .guide-index-hero h1,
.spira-shell .guide-topic-header h1,
.spira-shell .guide-hero h1 {
    font-family: var(--spira-font-family);
    font-size: 16px;
    line-height: 1.3;
    letter-spacing: 0;
    font-weight: 680;
    color: var(--spira-ink);
}
.spira-shell .main-content h2,
.spira-shell .guide-flow-heading h2,
.spira-shell .guide-index-header h2,
.spira-shell .guide-article-header h2 {
    font-family: var(--spira-font-family);
    font-size: 14px;
    line-height: 1.35;
    letter-spacing: 0;
    font-weight: 650;
    color: var(--spira-ink);
}
.spira-shell .main-content h3,
.spira-shell .guide-flow-card h3 {
    font-family: var(--spira-font-family);
    font-size: 13px;
    line-height: 1.35;
    letter-spacing: 0;
    font-weight: 650;
    color: var(--spira-ink);
}
.spira-shell .main-content p,
.spira-shell .main-content li,
.spira-shell .main-content label,
.spira-shell .main-content input,
.spira-shell .main-content select,
.spira-shell .main-content textarea,
.spira-shell .main-content button,
.spira-shell .main-content a {
    font-family: var(--spira-font-family);
}
.spira-shell .main-content p,
.spira-shell .main-content li { font-size: 12px; }
.spira-shell .main-content label { font-size: 12px; }
.spira-shell .main-content small { font-size: 11px; }

.spira-shell .eyebrow,
.spira-shell .guide-eyebrow,
.spira-shell .analytics-eyebrow {
    color: #4e6765 !important;
    font-size: 10px;
    line-height: 1.25;
    letter-spacing: .065em;
    font-weight: 700;
}

/* Cabeçalhos deixam de atuar como banners. */
.spira-shell .content-header,
.spira-shell .v6-content-header {
    padding: 15px 18px;
    margin-bottom: 16px;
    border: 1px solid var(--spira-border);
    border-left: 2px solid var(--spira-teal-500);
    border-radius: 9px;
    box-shadow: none;
}
.spira-shell .content-header h1,
.spira-shell .v6-content-header h1,
.spira-shell .module-page-header h1 {
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 680;
}
.spira-shell .v6-content-header p,
.spira-shell .module-page-header > div:first-child > p:last-child,
.spira-shell .section-heading p {
    max-width: 760px;
    margin-bottom: 0;
    color: var(--spira-muted);
    font-size: 12px;
    line-height: 1.4;
}
.spira-shell .module-page-header .header-actions-stack,
.spira-shell .v6-content-header .header-actions-stack {
    padding-top: 6px;
}

/* Menos caixas pesadas: superfícies e sombras passam a ser discretas. */
.spira-shell .welcome-message,
.spira-shell .stat-card,
.spira-shell .content-card,
.spira-shell .detail-card,
.spira-shell .module-main-panel,
.spira-shell .module-side-panel,
.spira-shell .module-card {
    border-color: var(--spira-border);
    border-radius: 9px;
    box-shadow: var(--spira-shadow-sm);
}
.spira-shell .stat-card:hover,
.spira-shell .module-card:hover {
    transform: none;
    box-shadow: var(--spira-shadow-sm);
}
.spira-shell .v6-welcome-card { padding: 16px 18px; }
.spira-shell .v6-welcome-card h2 { margin: 0; font-size: 14px; }
.spira-shell .v6-welcome-card p { margin: 4px 0 0; font-size: 11px; }
.spira-shell .plan-badge {
    padding: 6px 10px;
    background: #eef1f2;
    color: #46515a;
    font-size: 10px;
    font-weight: 700;
}
.spira-shell .stats-grid { gap: 12px; }
.spira-shell .stat-card { padding: 15px 17px; }
.spira-shell .stat-card h3 {
    color: #68727a;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: .02em;
    text-transform: none;
}
.spira-shell .stat-card .stat-number {
    color: var(--spira-ink);
    font-size: 24px;
    font-weight: 720;
}
.spira-shell .stat-card p { color: var(--spira-muted); font-size: 11px; }

.spira-shell .section-heading { margin-bottom: 11px; }
.spira-shell .section-heading h2,
.spira-shell .detail-card h2,
.spira-shell .module-side-panel h2,
.spira-shell .form-section h2,
.spira-shell .form-section legend {
    font-size: 14px;
    font-weight: 650;
    letter-spacing: 0;
    color: var(--spira-ink);
}

/* Ações: teal como acento funcional; azul deixa de ser o default de tudo. */
.spira-shell :where(.btn-primary, .btn-primary-action, .btn-submit, .btn-confirm, .btn-save, button[type="submit"]) {
    min-height: 34px;
    padding: 8px 13px;
    border-radius: 6px;
    background: var(--spira-teal-600);
    border-color: var(--spira-teal-600);
    color: #fff;
    box-shadow: none;
    font-size: 12px;
    font-weight: 650;
}
.spira-shell :where(.btn-primary, .btn-primary-action, .btn-submit, .btn-confirm, .btn-save, button[type="submit"]):hover {
    background: #185a56;
    border-color: #185a56;
    transform: none;
    filter: none;
    box-shadow: none;
}
.spira-shell :where(.btn-secondary-action, .btn-secondary, .btn-cancel, .btn-outline) {
    min-height: 34px;
    padding: 8px 13px;
    border: 1px solid var(--spira-border-strong);
    border-radius: 6px;
    background: #fff;
    color: #3d474f;
    font-size: 12px;
    font-weight: 600;
    box-shadow: none;
}
.spira-shell .navbar .nav-logout {
    min-height: auto;
    padding: .5rem .8rem;
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(255,255,255,.06);
    color: #eef3f6;
    box-shadow: none;
    font-weight: 550;
}
.spira-shell .navbar .nav-logout:hover {
    background: rgba(255,255,255,.11);
    border-color: rgba(255,255,255,.22);
    transform: none;
}
.spira-shell :where(a, button, input, select, textarea, [tabindex]):focus-visible {
    border-color: var(--spira-teal-500);
    box-shadow: var(--spira-focus);
}

/* Formulários mais compactos e menos "cartão dentro de cartão". */
.spira-shell :where(.form-control, .form-select, .form-textarea, input, select, textarea) {
    min-height: 38px;
    border-radius: 6px;
    font-size: 12px;
}
.spira-shell .investigation-form .form-section {
    padding: 15px;
    background: #fafbfb;
    border-color: var(--spira-border);
}
.spira-shell .investigation-form .form-section + .form-section { margin-top: 10px; }

/* Tabelas neutras: cor comunica estado, não decoração. */
.spira-shell :where(th) {
    color: #4e5962;
    background: #f2f4f5;
    font-size: 10px;
    letter-spacing: .04em;
}
.spira-shell :where(tbody tr:hover) { background: #f8f9f9; }

/* Central de Orientações: conteúdo de referência sem tratamento de "hero". */
.spira-shell .guide-index-page,
.spira-shell .guide-topic-page {
    max-width: 1180px;
    padding: 18px 0 44px;
    color: var(--spira-ink);
}
.spira-shell .guide-index-hero,
.spira-shell .guide-topic-header {
    max-width: 760px;
    margin-bottom: 17px;
}
.spira-shell .guide-index-hero h1,
.spira-shell .guide-topic-header h1 {
    margin: 0 0 4px;
    font-size: 16px;
    color: var(--spira-ink);
}
.spira-shell .guide-index-hero p,
.spira-shell .guide-topic-header > p {
    color: var(--spira-muted);
    font-size: 12px;
    line-height: 1.45;
}
.spira-shell .guide-index-grid {
    gap: 11px;
    margin-top: 16px;
}
.spira-shell .guide-index-card {
    min-height: 92px;
    padding: 14px 16px;
    border-radius: 10px;
    border-color: var(--spira-border);
    box-shadow: none;
}
.spira-shell .guide-index-card:hover {
    transform: none;
    border-color: #a8b5b9;
    box-shadow: none;
    background: #fafbfb;
}
.spira-shell .guide-index-card-number,
.spira-shell [class*="guide-index-card-"] .guide-index-card-number {
    flex-basis: 34px;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: #eef1f2;
    color: #3f4a52;
    font-size: 12px;
}
.spira-shell .guide-index-card-body { gap: 4px; }
.spira-shell .guide-index-card-body strong { font-size: 13px; color: var(--spira-ink); }
.spira-shell .guide-index-card-body small { font-size: 11px; color: var(--spira-muted); }
.spira-shell .guide-index-card-arrow { color: var(--spira-teal-600); font-size: 16px; }
.spira-shell .guide-index-note { font-size: 11px; color: var(--spira-muted); }

@media (max-width: 760px) {
    .spira-shell .main-content h1,
    .spira-shell .guide-index-hero h1,
    .spira-shell .guide-topic-header h1 { font-size: 16px; }
    .spira-shell .content-header,
    .spira-shell .v6-content-header { padding: 14px 15px; }
}

/* ==========================================================
   SPIRA 14.0.3 — TOPBAR INTERNA CLARA
   A sidebar navy permanece como âncora de navegação; o topo
   passa a ser uma superfície neutra para reduzir a massa azul.
   ========================================================== */
.spira-shell .navbar {
    background: #ffffff;
    border-bottom: 1px solid var(--spira-border);
    box-shadow: 0 1px 4px rgba(20, 30, 38, .045);
}

.spira-shell .navbar-logo {
    color: #122d55;
}
.spira-shell .navbar-logo:hover {
    color: #122d55;
    transform: none;
}
.spira-shell .navbar .logo-text {
    color: #122d55;
}

.spira-shell .navbar .admin-welcome {
    color: #5f6972;
    font-weight: 500;
}
.spira-shell .navbar .nav-link {
    color: #36414b;
    background: transparent;
}
.spira-shell .navbar .nav-link:hover {
    color: #1f292f;
    background: #f2f4f5;
    transform: none;
}

.spira-shell .navbar .nav-logout {
    min-height: auto;
    padding: .5rem .8rem;
    border: 1px solid var(--spira-border-strong);
    background: #ffffff;
    color: #46515a;
    box-shadow: none;
    font-weight: 550;
}
.spira-shell .navbar .nav-logout:hover {
    background: #f2f4f5;
    border-color: #adb5bb;
    color: #252b31;
    transform: none;
}

/* O contraste estrutural fica na navegação lateral, não no cabeçalho. */
.spira-shell .v6-sidebar {
    background: linear-gradient(180deg, #071a33, #0a2948);
}

/* ==========================================================
   SPIRA 14.0.3 — ICONOGRAFIA CONTEXTUAL DA SIDEBAR
   Um mesmo desenho herda a cor do contexto via currentColor.
   ========================================================== */
.spira-shell .v6-sidebar-nav .nav-icon {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #d7e2ea;
    transition: color .16s ease;
}

.spira-shell .v6-sidebar-nav .nav-icon .spira-icon {
    width: 18px;
    height: 18px;
    display: block;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.spira-shell .v6-sidebar-nav .nav-item:hover .nav-icon {
    color: #ffffff;
}

.spira-shell .v6-sidebar-nav .nav-item.active .nav-icon {
    color: #63c9bf;
}

body.sidebar-collapsed .spira-shell .v6-sidebar-nav .nav-icon,
body.sidebar-collapsed .spira-shell .v6-sidebar-nav .nav-icon .spira-icon {
    width: 20px;
    height: 20px;
}

/* SPIRA 14.0.3 — cards de acesso às etapas da investigação */
.spira-shell .future-modules-section .section-heading {
    max-width: 760px;
}

.spira-shell .compact-module-grid {
    align-items: stretch;
}

.spira-shell .module-access-card {
    min-height: 205px;
    height: 100%;
    padding: 15px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #f3f7fa;
    border: 1px solid #cad7e1;
    border-radius: 10px;
    box-shadow: none;
    cursor: pointer;
    transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.spira-shell .module-access-card:hover,
.spira-shell .module-access-card:focus-visible {
    background: #edf5f7;
    border-color: #6ab8b3;
    box-shadow: 0 4px 12px rgba(28, 61, 77, .08);
    transform: translateY(-1px);
    outline: none;
}

.spira-shell .module-access-card .module-card-icon {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d2e8e6;
    border-radius: 11px;
    background: linear-gradient(145deg, #eefafa 0%, #e4f5f3 100%);
    color: #0b3a5a;
    transition: color .16s ease, background-color .16s ease, border-color .16s ease;
}

.spira-shell .module-access-card .spira-module-icon {
    width: 25px;
    height: 25px;
    display: block;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.spira-shell .module-access-card:hover .module-card-icon,
.spira-shell .module-access-card:focus-visible .module-card-icon {
    color: #087a7e;
    border-color: #b8dfdb;
    background: linear-gradient(145deg, #e9f8f6 0%, #dcf1ef 100%);
}

.spira-shell .module-access-card .module-card-body {
    min-width: 0;
    flex: 1;
    align-self: stretch;
    display: flex;
    flex-direction: column;
}

.spira-shell .module-access-card h3 {
    margin: 0 0 7px;
    font-size: 14px;
    line-height: 1.28;
    font-weight: 650;
}

.spira-shell .module-access-card p {
    margin: 0;
    color: #5e6d78;
    font-size: 12.5px;
    line-height: 1.42;
}

.spira-shell .module-card-action {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: auto;
    padding: 5px 9px;
    border: 1px solid #b8cdd7;
    border-radius: 999px;
    background: #ffffff;
    color: #0b6f76;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .01em;
}

.spira-shell .module-access-card:hover .module-card-action,
.spira-shell .module-access-card:focus-visible .module-card-action {
    border-color: #6ab8b3;
    color: #084f56;
}

@media (max-width: 760px) {
    .spira-shell .module-access-card {
        min-height: 0;
    }
}