:root {
    --app-bg: #f4f7fc;
    --app-surface: #ffffff;
    --app-ink: #172026;
    --app-muted: #687782;
    --app-line: #d9e2f2;
    --app-primary: #145bdb;
    --app-primary-strong: #0a3b9a;
    --app-blue-soft: #dce8ff;
    --app-blue-mid: #1f77b8;
    --app-cyan: #0f6fbe;
    --app-amber: #d69a16;
    --app-rose: #ad3d48;
    --sidebar-bg: #071a3a;
    --sidebar-muted: #a9b9d6;
}

.inline-search-form {
    align-items: end;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.inline-search-form label {
    display: grid;
    gap: 5px;
    min-width: min(360px, 100%);
}

.documents-filter-form {
    display: grid;
    grid-template-columns: minmax(190px, 0.55fr) minmax(260px, 1fr) auto auto;
    gap: 10px;
    align-items: end;
    margin-top: 14px;
}

.documents-filter-form label {
    display: grid;
    gap: 5px;
}

.documents-filter-form span {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 850;
    text-transform: uppercase;
}

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

.documents-table-header {
    align-items: end;
}

.selection-cell {
    width: 42px;
    text-align: center;
}

.selection-cell input {
    width: 18px;
    height: 18px;
}

.table-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.table-actions form {
    margin: 0;
}

.full-width-panel {
    grid-column: 1 / -1;
}

* {
    box-sizing: border-box;
}

body {
    min-height: 100vh;
    margin: 0;
    color: var(--app-ink);
    background: var(--app-bg);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a {
    color: inherit;
}

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

.app-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    gap: 28px;
    padding: 24px 18px;
    color: #f8fbfb;
    background: var(--sidebar-bg);
}

.brand-mark {
    display: flex;
    gap: 12px;
    align-items: center;
    text-decoration: none;
}

.sidebar-logo {
    display: block;
    width: 220px;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.20));
}

.brand-symbol,
.sidebar-icon,
.empty-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    font-weight: 800;
}

.brand-symbol {
    width: 42px;
    height: 42px;
    border-radius: 8px;
    color: #ffffff;
    background: var(--app-primary);
}

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

.brand-mark small {
    color: var(--sidebar-muted);
    font-size: 0.78rem;
}

.sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sidebar-section {
    margin: 18px 10px 8px;
    color: var(--sidebar-muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.sidebar-link {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 9px 10px;
    border-radius: 8px;
    color: #eaf0f1;
    text-decoration: none;
    font-weight: 650;
}

.sidebar-link.active,
.sidebar-link:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.09);
}

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

.portal-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 22px 16px;
    background: #071a3a;
}

.portal-nav {
    display: grid;
    gap: 6px;
}

.portal-nav-link {
    min-height: 38px;
    padding: 9px 10px;
    border-radius: 8px;
    color: #dbeafe;
    font-size: 0.92rem;
    font-weight: 750;
    text-decoration: none;
}

.portal-nav-link.active,
.portal-nav-link:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.1);
}

.portal-main {
    min-width: 0;
    padding: 28px;
}

.portal-header {
    display: grid;
    grid-template-columns: 220px minmax(260px, 1fr) minmax(280px, 0.8fr) auto;
    gap: 18px;
    align-items: center;
    margin-bottom: 22px;
}

.compact-portal-header {
    margin-bottom: 18px;
}

.portal-brand-slot {
    width: 220px;
    min-height: 112px;
    display: grid;
    place-items: center;
}

.portal-tenant-logo {
    width: 210px;
    height: 104px;
    object-fit: cover;
    object-position: center;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.10);
}

.portal-header h1 {
    margin: 0 0 6px;
    color: #08245c;
    text-align: center;
    font-size: clamp(2.2rem, 3.2vw, 3.2rem);
    line-height: 1;
    font-weight: 950;
}

.portal-header-copy {
    min-width: 0;
}

.portal-greeting {
    margin: 0 0 4px;
    color: var(--app-primary-strong);
    font-size: clamp(1.15rem, 1.6vw, 1.45rem);
    line-height: 1.15;
    font-weight: 900;
}

.portal-header p,
.portal-muted {
    margin: 0;
    color: var(--app-muted);
}

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

.portal-kpi-card,
.portal-panel,
.portal-register-card {
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 18px 50px rgba(15, 23, 42, 0.08);
}

.portal-kpi-card {
    display: grid;
    gap: 5px;
    padding: 16px;
}

.portal-kpi-card span,
.portal-invite-summary span {
    color: var(--app-muted);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.portal-kpi-card strong {
    color: var(--app-ink);
    font-size: 1.45rem;
    font-weight: 900;
}

.payment-admin-grid {
    display: grid;
    grid-template-columns: minmax(420px, 0.95fr) minmax(360px, 1.05fr);
    gap: 18px;
    align-items: start;
}

.payment-side {
    display: grid;
    gap: 18px;
}

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

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

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

.payment-form label,
.form-grid label {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.payment-form label > span,
.form-grid label > span {
    color: var(--app-muted);
    font-size: 0.73rem;
    font-weight: 900;
    text-transform: uppercase;
}

.payment-form input,
.payment-form select,
.payment-form textarea {
    width: 100%;
    min-height: 40px;
    border: 1px solid #b8c6dc;
    border-radius: 7px;
    padding: 8px 10px;
    background: #ffffff;
    color: var(--app-ink);
}

.payment-form textarea {
    min-height: 84px;
    resize: vertical;
}

.payment-form-note {
    padding: 10px 12px;
    border: 1px solid #c7dcff;
    border-radius: 8px;
    color: #24405f;
    background: #eef6ff;
    font-size: 0.92rem;
}

.payment-email-option {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #d5e0f0;
    border-radius: 8px;
    background: #f8fbff;
}

.payment-email-option input {
    width: auto;
    min-height: 0;
    margin-top: 3px;
}

.payment-email-option span {
    display: grid;
    gap: 2px;
    color: var(--app-ink);
    font-size: 0.92rem;
    font-weight: 750;
    text-transform: none;
}

.payment-email-option small {
    color: var(--app-muted);
    font-size: 0.82rem;
    font-weight: 650;
}

.iban-suggestions {
    display: grid;
    gap: 5px;
    grid-column: 1 / -1;
    margin-top: -8px;
}

.iban-suggestion-item {
    width: 100%;
    min-height: 34px;
    border: 1px solid #c7dcff;
    border-radius: 7px;
    padding: 7px 9px;
    color: var(--app-primary-strong);
    background: #eef6ff;
    font-size: 0.86rem;
    font-weight: 750;
    text-align: left;
}

.iban-suggestion-item:hover,
.iban-suggestion-item:focus {
    border-color: var(--app-primary);
    background: #dce8ff;
}

.iban-suggestion-empty {
    color: var(--app-muted);
    font-size: 0.82rem;
}

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

.form-error-block,
.payment-form .errorlist {
    margin: 0;
    padding: 9px 11px;
    border: 1px solid #f2a0a8;
    border-radius: 8px;
    color: #9f1d2b;
    background: #fff1f2;
    font-weight: 750;
    list-style-position: inside;
}

.compact-stack {
    max-height: 420px;
    overflow: auto;
}

.compact-stack .stack-item {
    align-items: start;
    gap: 12px;
}

.payment-debt-groups {
    display: grid;
    gap: 8px;
}

.payment-debt-group {
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
}

.payment-debt-group summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 48px;
    padding: 10px 12px;
    cursor: pointer;
    list-style: none;
}

.payment-debt-group summary::-webkit-details-marker {
    display: none;
}

.payment-debt-group summary::before {
    content: "+";
    display: inline-grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border-radius: 6px;
    color: #ffffff;
    background: var(--app-primary);
    font-weight: 900;
}

.payment-debt-group[open] summary::before {
    content: "-";
}

.payment-debt-group summary span {
    display: grid;
    gap: 2px;
    flex: 1;
}

.payment-debt-group summary small,
.payment-debt-line span {
    color: var(--app-muted);
    font-size: 0.8rem;
}

.payment-debt-lines {
    display: grid;
    gap: 1px;
    padding: 0 10px 10px;
}

.payment-debt-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 9px;
    border-radius: 7px;
    background: #f6f9fe;
}

.payment-debt-line div {
    display: grid;
    gap: 2px;
}

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

@media (max-width: 720px) {
    .form-grid.two-columns {
        grid-template-columns: 1fr;
    }
}

.fraction-profile-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
    padding: 22px;
    border: 1px solid #bed4f5;
    border-radius: 8px;
    background: linear-gradient(135deg, #eef6ff 0%, #ffffff 58%, #e9f9ff 100%);
}

.fraction-profile-header h1 {
    margin: 4px 0;
    color: #08245c;
    font-size: clamp(2.25rem, 4.4vw, 4.2rem);
    line-height: 0.95;
    font-weight: 950;
}

.fraction-profile-header p {
    margin: 0;
    color: var(--app-muted);
    font-size: 1rem;
}

.fraction-profile-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.inline-action-form {
    display: inline-flex;
    margin-top: 6px;
}

.stacked-form {
    display: grid;
    gap: 10px;
}

.stacked-form label,
.stacked-form .stacked-field {
    display: grid;
    gap: 4px;
    width: 100%;
    margin: 0;
}

.stacked-form label span,
.stacked-form .stacked-field span {
    display: block;
    color: var(--app-muted);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.fraction-profile-side .stacked-form .form-control {
    width: 100%;
    min-height: 38px;
    padding: 8px 10px;
}

.fraction-profile-side .stacked-form textarea.form-control {
    min-height: 82px;
    resize: vertical;
}

.fraction-profile-side .stacked-form .btn {
    width: 100%;
}

.fraction-quick-actions-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
    padding: 10px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(23, 32, 38, 0.04);
}

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

.fraction-profile-main,
.fraction-profile-side {
    display: grid;
    gap: 16px;
}

.fraction-kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(142px, 1fr));
    gap: 8px;
    margin-bottom: 2px;
}

.fraction-kpi-card {
    min-height: 76px;
    padding: 9px 10px;
    border: 1px solid var(--app-line);
    border-left: 4px solid #7aa7e8;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(23, 32, 38, 0.045);
}

.fraction-kpi-card.is-primary {
    border-left-color: var(--app-primary);
    background: #f7fbff;
}

.fraction-kpi-card span,
.definition-list span,
.data-table .muted-cell {
    color: var(--app-muted);
    font-size: 0.78rem;
    font-weight: 800;
}

.fraction-kpi-card span {
    display: block;
    text-transform: uppercase;
}

.fraction-kpi-card strong {
    display: block;
    margin-top: 5px;
    color: var(--app-primary-strong);
    font-size: 1rem;
    line-height: 1.1;
    font-weight: 900;
}

.fraction-kpi-card small {
    display: block;
    margin-top: 4px;
    color: var(--app-muted);
    font-size: 0.73rem;
    font-weight: 700;
}

.financial-month-list {
    display: grid;
    gap: 10px;
}

.financial-month-card {
    overflow: hidden;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
}

.financial-month-card header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    background: #eef6ff;
    border-bottom: 1px solid #dbeafe;
}

.financial-month-card h3 {
    margin: 0;
    color: #08245c;
    font-size: 1rem;
    font-weight: 900;
}

.financial-month-lines {
    display: grid;
}

.financial-month-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(160px, 230px) minmax(110px, max-content);
    gap: 12px;
    align-items: center;
    padding: 9px 12px;
    border-bottom: 1px solid #edf2f7;
    background: #fff7f7;
}

.financial-month-line.is-credit {
    background: #effaf5;
}

.financial-month-description {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.financial-month-description strong {
    color: var(--app-ink);
    font-size: 0.92rem;
}

.financial-month-description span,
.financial-month-description small,
.financial-month-meta {
    color: var(--app-muted);
    font-size: 0.82rem;
}

.financial-month-description small {
    display: block;
    font-weight: 700;
}

.financial-month-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
}

.financial-month-value {
    color: var(--app-primary-strong);
    text-align: right;
    white-space: nowrap;
}

.financial-month-line.is-credit .financial-month-value {
    color: #047857;
}

.financial-month-card footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px 18px;
    padding: 10px 12px;
    color: #08245c;
    background: #f8fbff;
    font-size: 0.9rem;
}

.finance-calendar-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
}

.finance-calendar-card {
    display: grid;
    gap: 4px;
    min-height: 74px;
    padding: 10px;
    border: 1px solid var(--app-line);
    border-left: 5px solid #94a3b8;
    border-radius: 8px;
    background: #f8fafc;
}

.finance-calendar-card span {
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.finance-calendar-card strong {
    color: #08245c;
    font-size: 0.98rem;
    font-weight: 950;
}

.finance-calendar-card small {
    color: var(--app-muted);
    font-size: 0.74rem;
    font-weight: 800;
}

.finance-calendar-initial-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: min(100%, 420px);
    margin: 0 0 8px;
    padding: 9px 12px;
    border: 1px solid var(--app-line);
    border-left: 5px solid #94a3b8;
    border-radius: 8px;
    background: #f8fafc;
}

.finance-calendar-initial-card span {
    display: block;
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.finance-calendar-initial-card strong {
    display: block;
    margin-top: 2px;
    color: #08245c;
    font-size: 1rem;
    font-weight: 950;
}

.finance-calendar-initial-card small {
    color: var(--app-muted);
    font-size: 0.78rem;
    font-weight: 800;
    text-align: right;
}

.finance-calendar-card.is-paid {
    border-left-color: #10b981;
    background: #ecfdf5;
}

.finance-calendar-card.is-paid strong,
.finance-calendar-card.is-paid small {
    color: #047857;
}

.finance-calendar-card.is-due {
    border-left-color: #e11d48;
    background: #fff1f2;
}

.finance-calendar-initial-card.is-due {
    border-left-color: #e11d48;
    background: #fff1f2;
}

.finance-calendar-card.is-due strong,
.finance-calendar-card.is-due small,
.finance-calendar-initial-card.is-due strong,
.finance-calendar-initial-card.is-due small {
    color: #9f1239;
}

.finance-calendar-card.is-partial {
    border-left-color: #f59e0b;
    background: #fffbeb;
}

.finance-calendar-initial-card.is-partial {
    border-left-color: #f59e0b;
    background: #fffbeb;
}

.finance-calendar-card.is-partial strong,
.finance-calendar-card.is-partial small,
.finance-calendar-initial-card.is-partial strong,
.finance-calendar-initial-card.is-partial small {
    color: #92400e;
}

.finance-calendar-card.is-unissued {
    border-left-color: #94a3b8;
    background: #f8fafc;
}

.annual-calendar-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: end;
    margin-bottom: 14px;
}

.annual-calendar-hero h2 {
    margin: 4px 0 8px;
    color: #08245c;
    font-size: clamp(2rem, 3.4vw, 3.25rem);
    line-height: 1;
}

.annual-calendar-hero p {
    margin: 0;
    max-width: 780px;
    color: var(--app-muted);
}

.annual-calendar-year-nav,
.annual-calendar-year-form,
.annual-calendar-filter,
.annual-calendar-legend {
    display: flex;
    align-items: end;
    gap: 8px;
    flex-wrap: wrap;
}

.annual-calendar-year-form label,
.annual-calendar-filter label {
    display: grid;
    gap: 4px;
    margin: 0;
}

.annual-calendar-year-form span,
.annual-calendar-filter span {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.annual-calendar-year-form input {
    width: 96px;
}

.annual-calendar-summary {
    margin-bottom: 14px;
}

.annual-calendar-panel {
    display: grid;
    gap: 14px;
}

.annual-calendar-filter {
    justify-content: flex-end;
}

.annual-calendar-filter input {
    min-width: min(360px, 64vw);
}

.annual-calendar-legend {
    align-items: center;
}

.annual-calendar-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--app-muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: #94a3b8;
}

.legend-dot.is-paid {
    background: #10b981;
}

.legend-dot.is-partial {
    background: #f59e0b;
}

.legend-dot.is-due {
    background: #e11d48;
}

.legend-dot.is-unissued {
    background: #94a3b8;
}

.annual-calendar-scroll {
    overflow-x: auto;
    padding-bottom: 4px;
}

.annual-calendar-grid {
    display: grid;
    gap: 6px;
    min-width: 1248px;
}

.annual-calendar-row {
    display: grid;
    grid-template-columns: minmax(158px, 1.3fr) repeat(13, minmax(66px, 1fr));
    gap: 6px;
    align-items: stretch;
}

.annual-calendar-head {
    align-items: center;
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.annual-calendar-head > div {
    padding: 0 6px 2px;
}

.annual-calendar-fraction-cell,
.annual-calendar-month-cell {
    min-width: 0;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    text-decoration: none;
}

.annual-calendar-fraction-cell {
    display: grid;
    align-content: center;
    gap: 2px;
    min-height: 58px;
    padding: 8px 10px;
    border-left: 5px solid var(--app-primary);
    background: #fff;
}

.annual-calendar-fraction-cell strong {
    color: #08245c;
    font-size: 0.94rem;
    font-weight: 950;
}

.annual-calendar-fraction-cell small {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 750;
}

.annual-calendar-month-cell {
    display: grid;
    align-content: center;
    gap: 2px;
    min-height: 58px;
    padding: 7px 6px;
    border-left: 4px solid #94a3b8;
    background: #f8fafc;
}

.annual-calendar-month-cell:hover,
.annual-calendar-month-cell:focus,
.annual-calendar-fraction-cell:hover,
.annual-calendar-fraction-cell:focus {
    border-color: #94bbf5;
    box-shadow: 0 8px 20px rgba(37, 99, 235, 0.1);
}

.annual-calendar-month-cell span {
    color: var(--app-muted);
    font-size: 0.66rem;
    font-weight: 900;
    text-transform: uppercase;
}

.annual-calendar-month-cell strong {
    color: #08245c;
    font-size: 0.78rem;
    font-weight: 950;
}

.annual-calendar-month-cell small {
    color: var(--app-muted);
    font-size: 0.66rem;
    font-weight: 850;
    line-height: 1.05;
}

.annual-calendar-month-cell.is-paid {
    border-left-color: #10b981;
    background: #ecfdf5;
}

.annual-calendar-month-cell.is-paid strong,
.annual-calendar-month-cell.is-paid small {
    color: #047857;
}

.annual-calendar-month-cell.is-due {
    border-left-color: #e11d48;
    background: #fff1f2;
}

.annual-calendar-month-cell.is-due strong,
.annual-calendar-month-cell.is-due small {
    color: #9f1239;
}

.annual-calendar-month-cell.is-partial {
    border-left-color: #f59e0b;
    background: #fffbeb;
}

.annual-calendar-month-cell.is-partial strong,
.annual-calendar-month-cell.is-partial small {
    color: #92400e;
}

.annual-calendar-month-cell.is-unissued {
    border-left-color: #94a3b8;
    background: #f8fafc;
}

.annual-calendar-empty {
    padding: 18px;
    border: 1px dashed var(--app-line);
    border-radius: 8px;
    color: var(--app-muted);
    font-weight: 800;
}

.year-filter-form {
    display: flex;
    align-items: end;
    justify-content: flex-end;
    gap: 8px;
}

.year-filter-form label {
    display: grid;
    gap: 4px;
    margin: 0;
}

.year-filter-form span {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.year-filter-form input {
    width: 110px;
}

.documents-month-row td {
    padding: 10px 12px !important;
    color: #08245c;
    background: #eef6ff !important;
    border-top: 1px solid #cfe0fb;
    border-bottom: 1px solid #cfe0fb;
}

.documents-month-row strong {
    margin-right: 12px;
    font-weight: 950;
}

.documents-month-row span {
    color: var(--app-muted);
    font-size: 0.86rem;
    font-weight: 800;
}

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

.responsive-table {
    overflow: auto;
}

.data-table {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.data-table th,
.data-table td {
    padding: 9px 10px;
    border-bottom: 1px solid var(--app-line);
    text-align: left;
    vertical-align: top;
}

.data-table th {
    color: var(--app-muted);
    font-size: 0.75rem;
    font-weight: 900;
    text-transform: uppercase;
    background: #f5f8fd;
}

.data-table tbody tr:hover {
    background: #f8fbff;
}

.data-table td > strong,
.data-table .muted-cell {
    display: block;
}

.agreement-summary-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--app-line);
    border-left: 5px solid var(--app-primary);
    border-radius: 8px;
    background: #ffffff;
}

.agreement-summary-card.is-inactive {
    border-left-color: #94a3b8;
    opacity: 0.78;
}

.agreement-summary-card > div:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.agreement-summary-card dl,
.definition-list {
    display: grid;
    gap: 8px;
    margin: 0;
}

.agreement-summary-card dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.agreement-summary-card dt,
.definition-list span {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.agreement-summary-card dd,
.definition-list strong {
    margin: 0;
    color: var(--app-ink);
    font-size: 0.94rem;
}

.quick-actions-panel {
    display: grid;
    gap: 8px;
}

.quick-actions-panel h2,
.fraction-profile-side .panel h2 {
    margin: 0 0 4px;
    font-size: 1rem;
}

.text-danger {
    color: #ad3d48 !important;
}

.text-success {
    color: #13795b !important;
}

@media (max-width: 1180px) {
    .fraction-profile-layout {
        grid-template-columns: 1fr;
    }

    .fraction-profile-side {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .fraction-kpi-grid {
        grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    }
}

@media (max-width: 820px) {
    .fraction-profile-header {
        display: grid;
    }

    .fraction-profile-actions {
        justify-content: flex-start;
    }

    .fraction-split-grid,
    .agreement-card-grid,
    .fraction-profile-side {
        grid-template-columns: 1fr;
    }

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

    .financial-month-line {
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .financial-month-value {
        text-align: left;
    }

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

    .year-filter-form {
        justify-content: flex-start;
    }

    .annual-calendar-hero {
        grid-template-columns: 1fr;
    }

    .annual-calendar-year-nav,
    .annual-calendar-filter {
        justify-content: flex-start;
    }

    .annual-calendar-filter input {
        min-width: 100%;
    }
}

.fraction-picker-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
    gap: 18px;
    align-items: end;
    margin-bottom: 18px;
    padding: 22px;
    border: 1px solid #bed4f5;
    border-radius: 8px;
    background: linear-gradient(135deg, #ffffff 0%, #eef6ff 100%);
}

.fraction-picker-hero h1 {
    margin: 4px 0 8px;
    color: #08245c;
    font-size: clamp(2rem, 3.6vw, 3.4rem);
    line-height: 1;
    font-weight: 950;
}

.fraction-picker-hero p {
    margin: 0;
    color: var(--app-muted);
}

.fraction-picker-form {
    display: grid;
    gap: 8px;
}

.fraction-picker-form label {
    display: grid;
    gap: 5px;
}

.fraction-picker-form label span {
    color: var(--app-muted);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.fraction-picker-form select {
    width: 100%;
    min-height: 42px;
    border: 1px solid #b8c6dc;
    border-radius: 7px;
    padding: 8px 10px;
    background: #ffffff;
}

.fraction-picker-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 8px;
}

.fraction-picker-card {
    display: grid;
    gap: 3px;
    min-height: 66px;
    padding: 9px 11px;
    border: 1px solid var(--app-line);
    border-left: 4px solid var(--app-primary);
    border-radius: 8px;
    color: var(--app-ink);
    background: #ffffff;
    text-decoration: none;
}

.fraction-picker-card:hover,
.fraction-picker-card:focus {
    border-color: #94bbf5;
    background: #f5f9ff;
}

.fraction-picker-card strong {
    color: #08245c;
    font-size: 0.98rem;
}

.fraction-picker-card span,
.fraction-picker-card small {
    color: var(--app-muted);
    font-size: 0.76rem;
}

@media (max-width: 820px) {
    .fraction-picker-hero {
        grid-template-columns: 1fr;
    }
}

.portal-kpi-card small {
    color: var(--app-muted);
    font-weight: 700;
}

.portal-kpi-card.is-debt strong {
    color: #ad3d48;
}

.portal-kpi-card.is-credit strong,
.portal-credit {
    color: #047857;
}

.portal-debit {
    color: #ad3d48;
}

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

.portal-panel {
    padding: 16px;
}

.portal-wide {
    grid-column: 1 / -1;
}

.portal-panel-header {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.portal-panel-header h2 {
    margin: 0;
    font-size: 1rem;
}

.portal-panel-header a {
    color: var(--app-primary);
    font-size: 0.86rem;
    font-weight: 800;
}

.portal-list,
.portal-notice-list {
    display: grid;
    gap: 8px;
}

.portal-list-row,
.portal-notice-item {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    border: 1px solid #e6eefb;
    border-radius: 8px;
    background: #f8fbff;
}

.portal-list-row.portal-movement-credit {
    border-color: #b7ead5;
    background: #ecfdf5;
}

.portal-list-row.portal-movement-debit {
    border-color: #fecdd3;
    background: #fff1f2;
}

.portal-list-row strong,
.portal-list-row span {
    display: block;
}

.portal-list-row small {
    display: block;
    color: var(--app-muted);
    font-size: 0.78rem;
    font-weight: 700;
    margin-top: 2px;
}

.portal-list-row span,
.portal-notice-item {
    color: var(--app-muted);
    font-size: 0.88rem;
    font-weight: 700;
}

.portal-payment-card {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid #b8d4ff;
    border-radius: 8px;
    background: #eef6ff;
}

.portal-payment-card strong {
    color: var(--app-primary-strong);
    font-size: 1.6rem;
    font-weight: 900;
}

.portal-table-wrap {
    width: 100%;
    overflow-x: auto;
}

.portal-table {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.portal-table th,
.portal-table td {
    padding: 10px 9px;
    border-bottom: 1px solid #e6eefb;
    text-align: left;
    vertical-align: middle;
}

.portal-table th {
    color: var(--app-muted);
    background: #f5f8fd;
    font-size: 0.72rem;
    font-weight: 950;
    text-transform: uppercase;
}

.portal-table .numeric {
    text-align: right;
    white-space: nowrap;
}

.portal-row-credit td {
    background: #f0fdf4;
}

.portal-row-debit td {
    background: #fff7f7;
}

.portal-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 10px;
}

.portal-summary-card {
    display: grid;
    gap: 5px;
    padding: 12px;
    border: 1px solid #d8e6fb;
    border-radius: 8px;
    background: #f8fbff;
}

.portal-summary-card strong {
    color: var(--app-primary-strong);
}

.portal-summary-card span,
.portal-summary-card small {
    color: var(--app-muted);
    font-weight: 750;
}

.portal-agreement-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.portal-agreement-summary div {
    display: grid;
    gap: 4px;
    padding: 10px;
    border: 1px solid #d8e6fb;
    border-radius: 8px;
    background: #f8fbff;
}

.portal-agreement-summary span,
.portal-status-pill {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 950;
    text-transform: uppercase;
}

.portal-agreement-summary strong {
    color: var(--app-ink);
    font-size: 1.05rem;
}

.portal-status-pill {
    padding: 7px 10px;
    border-radius: 999px;
    background: #eef2f7;
}

.portal-status-pill.is-open {
    color: #047857;
    background: #d1fae5;
}

.portal-timeline {
    display: grid;
    gap: 10px;
}

.portal-timeline-item {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: space-between;
    padding: 12px;
    border: 1px solid #d8e6fb;
    border-radius: 8px;
    background: #f8fbff;
}

.portal-timeline-item strong,
.portal-timeline-item span,
.portal-timeline-item small {
    display: block;
}

.portal-timeline-item span,
.portal-timeline-item small {
    color: var(--app-muted);
    font-weight: 750;
}

.portal-timeline-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    white-space: nowrap;
}

.portal-under-construction {
    display: grid;
    gap: 8px;
    min-height: 220px;
    align-content: center;
    text-align: center;
}

.portal-under-construction > span {
    color: var(--app-primary);
    font-size: 0.78rem;
    font-weight: 950;
    text-transform: uppercase;
}

.portal-profile-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
    gap: 16px;
    align-items: start;
}

.portal-profile-form,
.portal-profile-summary {
    min-width: 0;
}

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

.portal-profile-grid label {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.portal-profile-grid label.span-two {
    grid-column: 1 / -1;
}

.portal-profile-grid label span {
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.portal-profile-grid input,
.portal-profile-grid textarea {
    width: 100%;
    max-width: 100%;
    min-height: 40px;
    padding: 9px 10px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
}

.portal-profile-grid textarea {
    min-height: 92px;
}

.portal-profile-grid em {
    color: var(--app-rose);
    font-style: normal;
    font-weight: 850;
}

.portal-register-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 28px;
    background: linear-gradient(135deg, #eaf2ff, #f8fbff);
}

.portal-register-shell {
    width: min(760px, 100%);
    display: grid;
    gap: 18px;
}

.portal-logo-link img {
    width: 220px;
    height: auto;
}

.portal-register-card {
    display: grid;
    gap: 18px;
    padding: 28px;
}

.portal-register-card h1 {
    margin: 4px 0 8px;
    font-size: 2.2rem;
}

.portal-register-card p {
    margin: 0;
    color: var(--app-muted);
}

.portal-invite-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.portal-invite-summary div {
    display: grid;
    gap: 4px;
    padding: 12px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

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

.profile-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.75fr);
    gap: 18px;
    align-items: start;
}

.profile-main-panel,
.profile-admin-panel {
    display: grid;
    gap: 18px;
}

.profile-main-panel {
    min-width: 0;
}

.profile-side-column,
.profile-bank-panel,
.profile-logo-row {
    min-width: 0;
}

.profile-side-column,
.profile-bank-panel,
.bank-account-form,
.bank-account-list {
    display: grid;
    gap: 14px;
}

.profile-logo-row {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
    padding: 14px;
    border: 1px solid #dbe8fb;
    border-radius: 8px;
    background: #f8fbff;
}

.bank-account-card {
    display: grid;
    gap: 10px;
    padding: 12px;
    border: 1px solid #dbe8fb;
    border-radius: 8px;
    background: #f8fbff;
}

.bank-account-flags,
.bank-account-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.bank-account-actions {
    justify-content: flex-end;
}

.profile-layout .inline-check {
    display: flex;
    gap: 8px;
    align-items: center;
    min-height: 28px;
}

.profile-layout .inline-check input {
    width: 16px;
    min-height: 16px;
}

.profile-layout .inline-check span {
    margin: 0;
    text-transform: none;
}

.profile-logo-row img,
.profile-logo-placeholder {
    width: 104px;
    height: 72px;
    object-fit: contain;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
}

.profile-logo-placeholder {
    display: grid;
    place-items: center;
    color: var(--app-muted);
    font-weight: 900;
}

.profile-logo-row label,
.profile-layout label span,
.admin-assignment-form label span {
    display: block;
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.profile-layout label {
    display: grid;
    gap: 5px;
    align-content: start;
    min-width: 0;
}

.profile-logo-row small {
    display: block;
    margin-top: 5px;
    color: var(--app-muted);
    font-weight: 700;
}

.profile-layout input,
.profile-layout select,
.profile-layout textarea {
    width: 100%;
    max-width: 100%;
    min-height: 38px;
    padding: 8px 10px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
}

.profile-layout textarea {
    min-height: 82px;
}

.profile-layout input[type="file"] {
    padding: 6px;
}

.profile-layout label em,
.form-error {
    display: block;
    margin-top: 4px;
    color: var(--app-rose);
    font-style: normal;
    font-weight: 850;
}

.admin-assignment-form,
.admin-list {
    display: grid;
    gap: 12px;
}

.profile-admin-panel .form-grid {
    grid-template-columns: 1fr;
}

.admin-card {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding: 12px;
    border: 1px solid #dbe8fb;
    border-radius: 8px;
    background: #f8fbff;
}

.admin-card.is-inactive {
    opacity: 0.68;
}

.admin-card strong,
.admin-card span,
.admin-card small {
    display: block;
}

.admin-card span,
.admin-card small {
    color: var(--app-muted);
    font-weight: 700;
}

.sidebar-link.disabled {
    color: rgba(234, 240, 241, 0.48);
}

.sidebar-icon {
    width: 24px;
    height: 24px;
    border-radius: 6px;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.12);
    font-size: 0.72rem;
}

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

.topbar {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: center;
    margin-bottom: 24px;
}

.topbar h1,
.auth-form h1 {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 800;
    letter-spacing: 0;
}

.eyebrow {
    color: var(--app-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

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

.context-pill,
.soft-badge {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 800;
}

.context-pill {
    color: #ffffff;
    background: var(--app-primary);
}

.soft-badge {
    color: var(--app-primary-strong);
    background: var(--app-blue-soft);
}

.soft-badge-link {
    text-decoration: none;
    transition: transform 0.16s ease, box-shadow 0.16s ease;
}

.soft-badge-link:hover,
.soft-badge-link:focus {
    color: var(--app-primary-strong);
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.12);
    transform: translateY(-1px);
}

.message-stack {
    margin-bottom: 16px;
}

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

.dashboard-hero-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    margin-bottom: 18px;
    padding: 20px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: linear-gradient(135deg, #ffffff 0%, #eef6ff 100%);
}

.dashboard-hero-panel h2 {
    margin: 2px 0 6px;
    color: #08245c;
    font-size: clamp(1.8rem, 2.5vw, 2.7rem);
    line-height: 1.05;
    font-weight: 950;
}

.dashboard-hero-panel p {
    margin: 0;
    color: var(--app-muted);
}

.dashboard-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.metric-card,
.panel {
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: var(--app-surface);
    box-shadow: 0 12px 28px rgba(23, 32, 38, 0.06);
}

.metric-card {
    min-height: 118px;
    padding: 18px;
    border-left: 5px solid var(--app-primary);
}

.metric-card span {
    display: block;
    color: var(--app-muted);
    font-size: 0.86rem;
    font-weight: 750;
}

.metric-card strong {
    display: block;
    margin-top: 16px;
    font-size: 1.35rem;
    font-weight: 850;
}

.accent-blue {
    border-left-color: var(--app-blue-mid);
}

.accent-cyan {
    border-left-color: var(--app-cyan);
}

.accent-amber {
    border-left-color: var(--app-amber);
}

.accent-rose {
    border-left-color: var(--app-rose);
}

.content-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
    gap: 18px;
}

.panel {
    min-width: 0;
    padding: 18px;
}

.wide-panel {
    grid-column: 1 / -1;
}

.panel-header {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 14px;
}

.panel-header h2,
.empty-panel h2 {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
}

.panel-header p,
.empty-panel p,
.muted-copy {
    margin: 4px 0 0;
    color: var(--app-muted);
}

.app-table {
    margin-bottom: 0;
}

.app-table thead th {
    color: var(--app-muted);
    font-size: 0.76rem;
    text-transform: uppercase;
}

.debt-fraction-card-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(142px, 1fr));
    gap: 10px;
}

.debt-fraction-card {
    display: grid;
    gap: 4px;
    min-height: 86px;
    padding: 12px;
    border: 1px solid var(--app-line);
    border-left: 5px solid var(--app-rose);
    border-radius: 8px;
    background: #fff7f8;
    text-decoration: none;
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.debt-fraction-card:hover,
.debt-fraction-card:focus {
    border-color: #fda4af;
    box-shadow: 0 10px 24px rgba(225, 29, 72, 0.11);
    transform: translateY(-1px);
}

.debt-fraction-card span {
    color: #08245c;
    font-size: 1rem;
    font-weight: 950;
}

.debt-fraction-card strong {
    color: #9f1239;
    font-size: 1.02rem;
    font-weight: 950;
}

.debt-fraction-card small {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 800;
}

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

.stack-item {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    padding: 12px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
}

.stack-item span,
.stack-item small {
    display: block;
    color: var(--app-muted);
}

.empty-state {
    color: var(--app-muted);
    text-align: center;
    padding: 20px 8px;
}

.admin-operations-panel {
    margin-bottom: 18px;
}

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

.operation-card {
    display: grid;
    gap: 5px;
    min-height: 92px;
    padding: 14px;
    border: 1px solid var(--app-line);
    border-left: 4px solid var(--app-blue-mid);
    border-radius: 8px;
    color: inherit;
    background: #ffffff;
    text-decoration: none;
}

.operation-card:hover {
    border-color: var(--app-primary);
    box-shadow: 0 12px 24px rgba(7, 47, 125, 0.10);
}

.operation-card strong {
    color: var(--app-primary-strong);
    font-size: 0.98rem;
}

.operation-card span {
    color: var(--app-muted);
    font-size: 0.88rem;
}

.operation-card.is-muted {
    border-left-color: #94a3b8;
    background: #f8fafc;
}

.admin-workspace {
    display: grid;
    grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.4fr);
    gap: 18px;
    align-items: start;
}

.admin-form-panel {
    position: sticky;
    top: 18px;
}

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

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

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

.admin-form-grid label,
.admin-edit-grid label {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.admin-form-grid label span,
.admin-edit-grid label span,
.admin-meta-grid strong {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 850;
    text-transform: uppercase;
}

.admin-form-grid input,
.admin-form-grid select,
.admin-form-grid textarea,
.admin-edit-grid input,
.admin-edit-grid select,
.admin-edit-grid textarea {
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border: 1px solid var(--app-line);
    border-radius: 6px;
    background: #ffffff;
}

.admin-form-grid textarea,
.admin-edit-grid textarea {
    min-height: 72px;
}

.admin-form-grid .inline-check,
.admin-edit-grid .inline-check {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
}

.admin-form-grid .inline-check input,
.admin-edit-grid .inline-check input {
    width: 18px;
    min-height: 18px;
}

.wide-field {
    grid-column: 1 / -1;
}

.admin-edit-list {
    display: grid;
    gap: 12px;
}

.admin-list-filter {
    display: grid;
    gap: 5px;
    margin-bottom: 14px;
}

.admin-list-filter span {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 850;
    text-transform: uppercase;
}

.admin-list-filter input {
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border: 1px solid var(--app-line);
    border-radius: 6px;
    background: #ffffff;
}

.admin-edit-card {
    padding: 14px;
    border: 1px solid var(--app-line);
    border-left: 5px solid var(--app-primary);
    border-radius: 8px;
    background: #ffffff;
}

.admin-edit-card.is-inactive {
    border-left-color: #94a3b8;
    background: #f8fafc;
}

.admin-card-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.admin-card-title strong {
    color: var(--app-primary-strong);
    font-size: 1rem;
}

.admin-card-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}

.fraction-edit-grid {
    grid-template-columns: 0.7fr 0.7fr 0.7fr 0.7fr 0.8fr 0.9fr;
}

.resident-edit-grid {
    grid-template-columns: 1.4fr 0.8fr 0.7fr 1.2fr 0.8fr 0.8fr;
}

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

.admin-meta-grid span {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.danger-soft {
    color: #9f1239;
    background: #ffe4e6;
}

.warning-soft {
    color: #92400e;
    background: #fef3c7;
}

.success-soft {
    color: #047857;
    background: #d1fae5;
}

.invite-admin-list {
    display: grid;
    gap: 10px;
}

.invite-admin-card {
    display: grid;
    grid-template-columns: minmax(150px, 1.1fr) minmax(180px, 1.2fr) minmax(110px, 0.7fr) minmax(130px, 0.8fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
}

.invite-admin-card div {
    min-width: 0;
}

.invite-admin-card strong,
.invite-admin-card span,
.invite-admin-card small {
    display: block;
}

.invite-admin-card strong {
    color: var(--app-primary-strong);
}

.invite-admin-card small {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 850;
    text-transform: uppercase;
}

.invite-admin-card span {
    overflow-wrap: anywhere;
}

.invite-admin-actions {
    justify-self: end;
}

.selection-panel {
    max-width: 880px;
}

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

.condominio-option {
    margin: 0;
}

.condominio-option button {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
    text-align: left;
}

.condominio-option button:hover {
    border-color: var(--app-primary);
}

.condominio-option strong,
.condominio-option small {
    display: block;
}

.condominio-option small {
    color: var(--app-muted);
}

.empty-panel {
    text-align: center;
    padding: 44px 28px;
}

.empty-icon {
    width: 50px;
    height: 50px;
    margin: 0 auto 14px;
    border-radius: 10px;
    color: #ffffff;
    background: var(--app-primary);
}

.auth-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
    background:
        linear-gradient(180deg, rgba(20, 91, 219, 0.10), rgba(244, 246, 248, 0.94)),
        var(--app-bg);
}

.auth-panel {
    width: min(440px, 100%);
}

.auth-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    text-decoration: none;
}

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

.auth-brand small {
    color: var(--app-muted);
}

.auth-form {
    display: grid;
    gap: 16px;
    padding: 26px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: var(--app-surface);
    box-shadow: 0 20px 42px rgba(23, 32, 38, 0.11);
}

.login-page {
    min-height: 100vh;
    background:
        linear-gradient(135deg, rgba(20, 91, 219, 0.12), rgba(214, 154, 22, 0.10)),
        #f6f8fc;
}

.login-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(420px, 0.92fr) minmax(0, 1.08fr);
}

.login-panel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(32px, 6vw, 76px);
}

.login-panel .auth-brand {
    margin-bottom: 28px;
}

.login-form {
    width: min(520px, 100%);
    padding: clamp(24px, 4vw, 38px);
}

.login-form h1 {
    margin: 12px 0 8px;
    font-size: clamp(2.4rem, 5vw, 4rem);
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0;
}

.login-form .form-floating {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.login-form .form-floating label {
    order: -1;
    color: var(--app-muted);
    font-size: 0.86rem;
    font-weight: 800;
}

.login-form .form-control {
    width: 100%;
    min-height: 50px;
    padding: 10px 12px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    color: var(--app-ink);
    background: #ffffff;
    font: inherit;
}

.login-form .form-control:focus {
    outline: 3px solid rgba(20, 91, 219, 0.16);
    border-color: var(--app-primary);
}

.login-register-callout {
    display: grid;
    gap: 8px;
    padding: 14px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

.login-register-callout span {
    color: var(--app-muted);
    font-size: 0.9rem;
    font-weight: 750;
}

.login-register-callout a {
    color: var(--app-primary-strong);
    font-weight: 900;
    text-decoration: none;
}

.login-visual {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    background: #071a3a;
}

.login-visual img {
    width: 100%;
    height: 100%;
    min-height: 100vh;
    object-fit: cover;
    display: block;
}

.login-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(7, 26, 58, 0.20), rgba(7, 26, 58, 0));
    pointer-events: none;
}

.construction-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
    background:
        linear-gradient(135deg, rgba(20, 91, 219, 0.14), rgba(214, 154, 22, 0.10)),
        #f6f8fc;
}

.construction-panel {
    width: min(760px, 100%);
    padding: clamp(28px, 5vw, 54px);
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 24px 54px rgba(7, 26, 58, 0.14);
}

.construction-logo {
    display: block;
    width: min(260px, 70vw);
    height: auto;
    margin-bottom: 28px;
}

.construction-panel h1 {
    margin: 18px 0 14px;
    font-size: clamp(2.2rem, 5vw, 4.4rem);
    line-height: 1;
    font-weight: 900;
}

.construction-panel p {
    max-width: 620px;
    margin: 0;
    color: var(--app-muted);
    font-size: 1.08rem;
    line-height: 1.7;
}

.btn-primary {
    --bs-btn-bg: var(--app-primary);
    --bs-btn-border-color: var(--app-primary);
    --bs-btn-hover-bg: var(--app-primary-strong);
    --bs-btn-hover-border-color: var(--app-primary-strong);
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 14px;
    border: 1px solid transparent;
    border-radius: 8px;
    font: inherit;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

.btn-primary {
    color: #ffffff;
    border-color: var(--app-primary);
    background: var(--app-primary);
}

.btn-primary:hover {
    color: #ffffff;
    border-color: var(--app-primary-strong);
    background: var(--app-primary-strong);
}

.btn-success {
    color: #ffffff;
    border-color: #15803d;
    background: #16a34a;
}

.btn-success:hover {
    color: #ffffff;
    border-color: #166534;
    background: #15803d;
}

.news-admin-workspace {
    align-items: start;
}

.publication-tabs {
    margin-bottom: 18px;
}

.publication-tab-panel {
    display: none;
}

.publication-tab-panel.is-active {
    display: block;
}

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

.publication-form-grid .span-all {
    grid-column: 1 / -1;
}

.publication-form-grid textarea {
    min-height: 150px;
}

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

.publication-admin-list h3 {
    margin: 10px 0 0;
    color: var(--app-primary-strong);
    font-size: 1.05rem;
}

.publication-admin-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 14px;
    border: 1px solid #d5e2f3;
    border-left: 5px solid #9eb4d8;
    border-radius: 8px;
    background: #fff;
}

.publication-admin-card.is-published {
    border-left-color: var(--app-primary);
    background: #f8fbff;
}

.publication-admin-card strong,
.publication-admin-card span,
.publication-admin-card small {
    display: block;
}

.publication-admin-card strong {
    color: var(--app-primary-strong);
}

.publication-admin-card small {
    color: #607080;
    font-weight: 700;
}

.publication-order-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.publication-vote-options {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.publication-vote-options span {
    padding: 4px 8px;
    border-radius: 999px;
    background: #e8f1ff;
    color: var(--app-primary-strong);
    font-size: 0.82rem;
    font-weight: 700;
}

.portal-publications-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(320px, 0.8fr);
    gap: 18px;
}

.portal-section-heading {
    margin-bottom: 12px;
}

.portal-section-heading h2 {
    margin: 0;
    color: var(--app-primary-strong);
    font-size: 1.35rem;
}

.portal-section-heading p {
    margin: 4px 0 0;
    color: #607080;
}

.portal-news-column,
.portal-votes-column {
    display: grid;
    align-content: start;
    gap: 16px;
}

.portal-news-card,
.portal-vote-card {
    overflow: hidden;
    border: 1px solid #d5e2f3;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 18px 42px rgba(16, 35, 71, 0.08);
}

.portal-news-card.is-featured {
    border-color: #8bbcff;
}

.portal-news-card img {
    display: block;
    width: 100%;
    max-height: 260px;
    object-fit: cover;
}

.portal-news-copy {
    padding: 20px;
}

.portal-news-copy small,
.portal-vote-header small {
    color: #607080;
    font-weight: 800;
    text-transform: uppercase;
}

.portal-news-copy h3,
.portal-vote-card h3 {
    margin: 8px 0;
    color: var(--app-primary-strong);
    font-size: 1.45rem;
}

.portal-news-summary {
    color: #425b76;
    font-size: 1.02rem;
}

.portal-news-body {
    color: #162335;
    line-height: 1.7;
}

.portal-vote-card {
    padding: 18px;
}

.portal-vote-header p {
    color: #162335;
    font-weight: 800;
}

.portal-vote-description {
    color: #607080;
    line-height: 1.6;
}

.portal-vote-form {
    display: grid;
    gap: 10px;
    margin: 16px 0;
}

.portal-vote-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 10px 12px;
    border: 1px solid #d5e2f3;
    border-radius: 8px;
    background: #f8fbff;
    cursor: pointer;
    font-weight: 700;
}

.portal-vote-results {
    display: grid;
    gap: 12px;
    margin: 14px 0;
}

.portal-vote-result-row {
    display: grid;
    gap: 5px;
}

.portal-vote-result-row span,
.portal-vote-result-row strong {
    color: var(--app-primary-strong);
}

.portal-vote-bar {
    overflow: hidden;
    height: 8px;
    border-radius: 999px;
    background: #e5edf8;
}

.portal-vote-bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--app-primary), #19b9d2);
}

.btn-outline-primary {
    color: var(--app-primary);
    border-color: var(--app-primary);
    background: #ffffff;
}

.btn-outline-secondary {
    color: #4b5b6b;
    border-color: #cbd5e1;
    background: #ffffff;
}

.btn-light {
    color: var(--app-primary-strong);
    border-color: #e2ecff;
    background: #ffffff;
}

.btn-lg {
    min-height: 48px;
    padding: 11px 18px;
}

.btn-sm {
    min-height: 32px;
    padding: 6px 10px;
    font-size: 0.88rem;
}

.w-100 {
    width: 100%;
}

.btn-outline-primary {
    --bs-btn-color: var(--app-primary);
    --bs-btn-border-color: var(--app-primary);
    --bs-btn-hover-bg: var(--app-primary);
    --bs-btn-hover-border-color: var(--app-primary);
}

.landing-page {
    min-height: 100vh;
    color: var(--app-ink);
    background: #f6f8fc;
}

.landing-nav {
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 58px;
    padding: 5px clamp(18px, 4vw, 46px);
    border-bottom: 1px solid var(--app-line);
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(12px);
}

.landing-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 48px;
    text-decoration: none;
}

.brand-logo {
    display: block;
    width: auto;
    height: 52px;
    max-width: min(300px, 66vw);
    object-fit: contain;
}

.auth-brand .brand-logo {
    width: auto;
    height: 50px;
}

.register-brand .brand-logo {
    width: auto;
    height: 56px;
}

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

.landing-brand small,
.landing-nav-links a {
    color: var(--app-muted);
}

.landing-nav-links {
    display: flex;
    align-items: center;
    gap: 14px;
    font-weight: 750;
    font-size: 0.94rem;
}

.landing-nav-links a {
    text-decoration: none;
}

.landing-hero {
    display: grid;
    grid-template-columns: minmax(360px, 0.78fr) minmax(500px, 1.22fr);
    gap: clamp(30px, 4.5vw, 72px);
    align-items: center;
    min-height: calc(100vh - 58px);
    padding: clamp(30px, 5vw, 68px) clamp(18px, 4vw, 54px);
    background:
        linear-gradient(120deg, rgba(20, 91, 219, 0.12), rgba(214, 154, 22, 0.10)),
        #f6f8fc;
}

.hero-copy {
    max-width: 620px;
}

.hero-kicker,
.plan-label {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 5px 10px;
    border-radius: 8px;
    color: var(--app-primary-strong);
    background: #e2ecff;
    font-size: 0.78rem;
    font-weight: 850;
    text-transform: uppercase;
}

.hero-copy h1 {
    margin: 18px 0 14px;
    font-size: clamp(3rem, 5.1vw, 5.15rem);
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0;
}

.hero-copy p,
.section-heading p,
.feature-card p,
.pricing-card p,
.signup-panel p {
    color: var(--app-muted);
}

.hero-copy p {
    max-width: 680px;
    font-size: 1.16rem;
    line-height: 1.65;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.hero-image-card {
    justify-self: center;
    width: min(820px, 100%);
    margin: 0;
    overflow: hidden;
    border: 0;
    border-radius: 8px;
    background: transparent;
    box-shadow: 0 24px 54px rgba(7, 26, 58, 0.16);
}

.hero-image-card img {
    display: block;
    width: 100%;
    height: auto;
    max-height: calc(100vh - 104px);
    object-fit: cover;
    object-position: center;
    border-radius: 8px;
}

.hero-product,
.feature-card,
.pricing-card,
.signup-panel {
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: var(--app-surface);
    box-shadow: 0 20px 44px rgba(23, 32, 38, 0.10);
}

.hero-product {
    padding: 22px;
}

.product-topline {
    padding-bottom: 18px;
    border-bottom: 1px solid var(--app-line);
}

.product-topline span,
.product-metrics span {
    display: block;
    color: var(--app-muted);
    font-size: 0.82rem;
    font-weight: 750;
}

.product-topline strong {
    display: block;
    margin-top: 6px;
    font-size: 1.35rem;
}

.product-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 18px 0;
}

.product-metrics div {
    min-height: 96px;
    padding: 14px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
}

.product-metrics strong {
    display: block;
    margin-top: 12px;
    font-size: 1.5rem;
}

.product-flow {
    display: grid;
    gap: 10px;
}

.product-flow span {
    display: block;
    padding: 12px;
    border-left: 4px solid var(--app-primary);
    border-radius: 8px;
    background: #f3f7ff;
    font-weight: 800;
}

.landing-section {
    padding: clamp(44px, 7vw, 84px) clamp(18px, 4vw, 54px);
}

.landing-cta-section {
    padding-top: 0;
}

.section-heading {
    max-width: 760px;
    margin-bottom: 26px;
}

.section-heading h2,
.signup-panel h2 {
    margin: 12px 0 10px;
    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: 1.05;
    font-weight: 900;
    letter-spacing: 0;
}

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

.feature-card,
.pricing-card {
    padding: 20px;
}

.feature-icon {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 8px;
    color: #ffffff;
    background: var(--app-primary);
    font-weight: 900;
}

.feature-card h3,
.pricing-card h3 {
    margin: 16px 0 8px;
    font-size: 1.06rem;
    font-weight: 850;
}

.pricing-section,
.workflow-section {
    background: #edf3ff;
}

.plans-hero {
    padding-bottom: 28px;
}

.plans-hero .section-heading {
    margin-bottom: 0;
}

.plans-hero h1 {
    margin: 14px 0 10px;
    font-size: clamp(2.25rem, 5vw, 4.3rem);
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0;
}

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

.pricing-card {
    display: grid;
    gap: 18px;
    align-content: start;
}

.featured-plan {
    border-color: rgba(20, 91, 219, 0.55);
    box-shadow: 0 22px 50px rgba(20, 91, 219, 0.16);
}

.price {
    display: block;
    font-size: 1.4rem;
}

.pricing-card ul {
    display: grid;
    gap: 8px;
    margin: 0;
    padding-left: 1.2rem;
    color: var(--app-muted);
}

.workflow-list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.workflow-list div {
    min-height: 120px;
    padding: 18px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
}

.workflow-list strong {
    display: block;
    margin-bottom: 12px;
    color: var(--app-primary);
    font-size: 1.5rem;
}

.workflow-list span {
    color: var(--app-muted);
    font-weight: 700;
}

.signup-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: clamp(24px, 4vw, 38px);
}

.register-page {
    min-height: 100vh;
    padding: clamp(22px, 4vw, 48px);
    background:
        linear-gradient(135deg, rgba(20, 91, 219, 0.12), rgba(214, 154, 22, 0.10)),
        #f6f8fc;
}

.register-shell {
    width: min(1320px, 100%);
    margin: 0 auto;
}

.register-brand {
    display: inline-flex;
    margin-bottom: 24px;
}

.register-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(340px, 0.75fr);
    gap: 20px;
    align-items: stretch;
}

.register-form,
.onboarding-preview {
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 20px 44px rgba(23, 32, 38, 0.10);
}

.register-form {
    display: grid;
    gap: 20px;
    padding: clamp(22px, 4vw, 34px);
}

.register-form h1,
.onboarding-preview h2 {
    margin: 12px 0 8px;
    font-size: clamp(1.9rem, 4vw, 3rem);
    line-height: 1.05;
    font-weight: 900;
    letter-spacing: 0;
}

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

.register-form .form-floating {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.register-form .form-floating label {
    order: -1;
    color: var(--app-muted);
    font-size: 0.86rem;
    font-weight: 800;
}

.register-form .form-control,
.register-form .form-select {
    width: 100%;
    min-height: 48px;
    padding: 10px 12px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    color: var(--app-ink);
    background: #ffffff;
    font: inherit;
    line-height: 1.3;
}

.register-form .form-control:focus,
.register-form .form-select:focus {
    outline: 3px solid rgba(20, 91, 219, 0.16);
    border-color: var(--app-primary);
}

.register-form .form-control.is-invalid,
.register-form .form-select.is-invalid {
    border-color: var(--app-rose);
    background: #fff8f8;
}

.invalid-feedback {
    display: block;
    color: var(--app-rose);
    font-size: 0.84rem;
    font-weight: 850;
}

.alert {
    padding: 12px 14px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

.alert-danger {
    color: #8f1f2c;
    border-color: #f0b8bf;
    background: #fff2f3;
}

.alert-error,
.form-alert-error,
.errorlist {
    color: #8f1f2c;
    border-color: #ef9aa6;
    background: #fff1f2;
}

.alert-error,
.form-alert-error {
    padding: 12px 14px;
    border-width: 1px;
    border-style: solid;
    border-radius: 8px;
    font-weight: 850;
}

.errorlist {
    display: grid;
    gap: 4px;
    margin: 6px 0 0;
    padding: 8px 10px;
    border-width: 1px;
    border-style: solid;
    border-radius: 8px;
    list-style: none;
    font-size: 0.84rem;
    font-weight: 850;
}

.alert-success {
    color: #0f5d43;
    border-color: #a9dbc9;
    background: #f0fbf7;
}

.wide-field {
    grid-column: 1 / -1;
}

.fixed-field {
    grid-column: 1 / -1;
    min-height: 58px;
    padding: 9px 12px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

.fixed-field span,
.fixed-field strong {
    display: block;
}

.fixed-field span {
    color: var(--app-muted);
    font-size: 0.78rem;
}

.fixed-field strong {
    margin-top: 3px;
    color: var(--app-ink);
    font-weight: 850;
}

.form-note {
    margin: 0;
    color: var(--app-muted);
    font-size: 0.88rem;
}

.submit-feedback {
    margin: -6px 0 0;
    color: var(--app-primary-strong);
    font-size: 0.9rem;
    font-weight: 800;
}

.register-form .btn {
    width: 100%;
    min-height: 48px;
    border-radius: 8px;
    font-weight: 850;
}

.register-form .btn:disabled {
    cursor: wait;
    opacity: 0.72;
}

.onboarding-preview {
    padding: clamp(22px, 4vw, 30px);
}

.preview-steps {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.preview-steps div {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 54px;
    padding: 12px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

.preview-steps strong {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    color: #ffffff;
    background: var(--app-primary);
    font-size: 0.9rem;
}

.preview-steps span {
    color: var(--app-muted);
    font-weight: 800;
}

.onboarding-layout {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.onboarding-sidebar,
.tenant-summary {
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(23, 32, 38, 0.06);
}

.onboarding-app-sidebar {
    gap: 22px;
}

.onboarding-sidebar-nav {
    display: grid;
    gap: 10px;
}

.sidebar-onboarding-title {
    margin-top: 8px;
    color: #ffffff;
    font-size: 1.08rem;
    line-height: 1.18;
    letter-spacing: 0;
    text-transform: none;
}

.sidebar-onboarding-steps li {
    color: #eaf0f1;
    border-color: rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.08);
}

.sidebar-onboarding-steps li:not(.step-current):not(.step-done) strong {
    color: #dbe7ff;
    background: rgba(255, 255, 255, 0.12);
}

.onboarding-sidebar {
    position: sticky;
    top: 24px;
    padding: 18px;
}

.onboarding-sidebar-header h2,
.tenant-summary h2 {
    margin: 12px 0 0;
    font-size: 1.15rem;
    font-weight: 900;
}

.onboarding-steps {
    display: grid;
    gap: 10px;
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}

.onboarding-steps li {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 10px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    color: var(--app-muted);
    background: #f8fbff;
    font-weight: 800;
}

.onboarding-steps strong {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    color: var(--app-primary-strong);
    background: var(--app-blue-soft);
}

.onboarding-steps .step-done {
    color: #0f5d43;
    border-color: #b9dfd0;
    background: #f2fbf7;
}

.onboarding-steps .step-done strong {
    color: #ffffff;
    background: #16805d;
}

.onboarding-steps .step-current {
    color: var(--app-primary-strong);
    border-color: rgba(20, 91, 219, 0.35);
    background: #eef5ff;
}

.onboarding-steps .step-current strong {
    color: #ffffff;
    background: var(--app-primary);
}

.onboarding-main {
    display: grid;
    gap: 18px;
    min-width: 0;
}

.tenant-summary {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    gap: 18px;
    padding: 18px;
}

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

.tenant-summary dt {
    color: var(--app-muted);
    font-size: 0.78rem;
    font-weight: 850;
    text-transform: uppercase;
}

.tenant-summary dd {
    margin: 3px 0 0;
    font-weight: 850;
}

.onboarding-status-summary {
    border-left: 5px solid #16805d;
}

.onboarding-form-panel {
    padding: 20px;
}

.onboarding-form {
    display: grid;
    gap: 18px;
}

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

.form-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.form-field label {
    color: var(--app-muted);
    font-size: 0.86rem;
    font-weight: 850;
}

.form-field .form-control {
    width: 100%;
    min-height: 48px;
    padding: 10px 12px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    color: var(--app-ink);
    background: #ffffff;
    font: inherit;
}

.form-field textarea.form-control {
    min-height: 92px;
    resize: vertical;
}

.form-field .form-control:focus {
    outline: 3px solid rgba(20, 91, 219, 0.16);
    border-color: var(--app-primary);
}

.form-field .form-control.is-invalid {
    border-color: var(--app-rose);
    background: #fff8f8;
}

.field-help {
    color: var(--app-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

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

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

.strategy-button {
    min-height: 118px;
    padding: 16px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    color: var(--app-ink);
    background: #f8fbff;
    text-align: left;
    cursor: pointer;
}

.strategy-button strong,
.strategy-button span {
    display: block;
}

.strategy-button strong {
    color: var(--app-primary-strong);
    font-size: 1rem;
    font-weight: 900;
}

.strategy-button span {
    margin-top: 8px;
    color: var(--app-muted);
    font-size: 0.9rem;
    font-weight: 700;
}

.strategy-button.is-active {
    border-color: rgba(20, 91, 219, 0.55);
    background: #edf4ff;
    box-shadow: inset 0 0 0 2px rgba(20, 91, 219, 0.14);
}

.generate-table-button {
    white-space: nowrap;
}

.strategy-panel {
    display: none;
    padding: 18px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
}

.strategy-panel.is-active {
    display: grid;
    gap: 16px;
}

.compact-panel-header {
    margin-bottom: 0;
}

.door-builder,
.advanced-blocks {
    display: grid;
    gap: 10px;
}

.door-row {
    display: grid;
    grid-template-columns: minmax(120px, 0.7fr) minmax(140px, 0.7fr) auto;
    gap: 10px;
    align-items: center;
}

.advanced-block {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

.advanced-block.is-dragging {
    opacity: 0.55;
}

.block-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
}

.drag-handle {
    margin-right: auto;
    padding: 6px 9px;
    border: 1px dashed #9fb3d8;
    border-radius: 8px;
    color: var(--app-primary-strong);
    background: #edf4ff;
    font-size: 0.82rem;
    font-weight: 900;
    cursor: grab;
}

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

.fraction-editor {
    display: grid;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

.editor-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
}

.import-structure {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.import-structure input[type="file"] {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    opacity: 0;
    pointer-events: none;
}

.editor-warning.is-hidden {
    display: none;
}

.editor-total {
    min-width: 132px;
    padding: 8px 10px;
    border: 1px solid #f0b8bf;
    border-radius: 8px;
    color: #8f1f2c;
    background: #fff2f3;
    font-weight: 900;
    text-align: center;
}

.editor-total.is-valid {
    color: #0f5d43;
    border-color: #a9dbc9;
    background: #f0fbf7;
}

.fraction-editor-table input.form-control {
    min-width: 110px;
}

.fraction-editor-table tfoot td {
    border-top: 2px solid var(--app-line);
    color: var(--app-ink);
    font-weight: 900;
}

.fraction-editor-table tfoot td:nth-child(2) {
    color: var(--app-primary-strong);
}

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

.submit-area {
    display: grid;
    gap: 8px;
    justify-items: start;
}

.form-submit-error {
    display: none;
    max-width: 420px;
    color: var(--app-rose);
    font-size: 0.9rem;
    font-weight: 900;
}

.form-submit-error.is-visible {
    display: block;
}

.nested-form-panel {
    box-shadow: none;
}

.building-editor {
    display: grid;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background:
        linear-gradient(90deg, rgba(20, 91, 219, 0.08), rgba(214, 154, 22, 0.05)),
        #f8fbff;
}

.building-floor {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 8px;
    align-items: stretch;
}

.building-floor-label {
    display: grid;
    place-items: center;
    min-height: 76px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    color: var(--app-primary-strong);
    background: #ffffff;
    font-size: 1.15rem;
    font-weight: 900;
}

.building-units {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 8px;
}

.building-unit {
    display: grid;
    grid-template-areas:
        "porta referencia action"
        "porta permilagem action";
    grid-template-columns: minmax(92px, 0.78fr) minmax(0, 1fr) auto;
    column-gap: 8px;
    row-gap: 6px;
    align-items: end;
    padding: 9px;
    border: 1px solid var(--app-line);
    border-left-width: 6px;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(23, 32, 38, 0.06);
}

.building-unit label {
    display: grid;
    gap: 3px;
    min-width: 0;
    margin: 0;
}

.unit-reference-field {
    grid-area: referencia;
}

.unit-door-field {
    grid-area: porta;
    align-self: center;
}

.unit-permilagem-field {
    grid-area: permilagem;
}

.building-unit label span {
    color: var(--app-muted);
    font-size: 0.68rem;
    font-weight: 850;
    text-transform: uppercase;
}

.building-unit .form-control {
    width: 100%;
    min-width: 0;
    min-height: 34px;
    padding: 6px 8px;
    font-size: 0.9rem;
}

.unit-door-field .form-control {
    min-height: 34px;
    border-color: #b8d4ff;
    color: var(--app-primary-strong);
    background: #edf5ff;
    font-size: 1.12rem;
    font-weight: 900;
    text-align: center;
}

.delete-unit-button {
    grid-area: action;
    width: 72px;
    min-height: 34px;
    align-self: end;
}

.building-unit.is-marked-delete {
    display: none;
}

.moradores-layout {
    align-items: start;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
}

.moradores-form-panel,
.moradores-list-panel {
    align-self: start;
}

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

.toggle-row {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    align-items: center;
    margin: 12px 0;
    color: var(--app-muted);
    font-size: 0.9rem;
    font-weight: 800;
}

.toggle-row label {
    display: inline-flex;
    gap: 8px;
    align-items: center;
}

.toggle-row input {
    width: 17px;
    height: 17px;
}

.import-panel {
    display: grid;
    gap: 10px;
    margin-top: 16px;
    padding: 12px;
    border: 1px dashed #b8d4ff;
    border-radius: 8px;
    background: #f4f8ff;
}

.import-panel h3 {
    margin: 0 0 4px;
    color: var(--app-primary-strong);
    font-size: 1rem;
    font-weight: 900;
}

.import-panel p {
    margin: 0;
    color: var(--app-muted);
    font-size: 0.86rem;
    font-weight: 650;
}

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

.moradores-filter {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 10px;
    align-items: end;
    margin-bottom: 12px;
}

.moradores-filter label {
    grid-column: 1 / -1;
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 850;
    text-transform: uppercase;
}

.moradores-filter span {
    min-width: max-content;
    color: var(--app-muted);
    font-size: 0.82rem;
    font-weight: 800;
}

.moradores-list {
    display: grid;
    gap: 6px;
}

.morador-card {
    padding: 7px 8px;
    border: 1px solid var(--app-line);
    border-left: 5px solid var(--app-primary);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 12px 26px rgba(23, 32, 38, 0.07);
}

.morador-card.is-hidden {
    display: none;
}

.morador-card-form {
    display: grid;
    gap: 5px;
}

.morador-card-head {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(125px, 0.65fr);
    gap: 5px;
    align-items: end;
}

.morador-card-head > *,
.morador-field {
    min-width: 0;
}

.morador-name-input {
    color: var(--app-primary-strong);
    font-weight: 900;
}

.morador-card-fields {
    display: grid;
    grid-template-areas:
        "fracao email email nif"
        "telemovel telemovel percentagem percentagem";
    grid-template-columns: minmax(92px, 0.7fr) minmax(0, 1fr) minmax(0, 1fr) minmax(96px, 0.72fr);
    column-gap: 6px;
    row-gap: 10px;
    align-items: stretch;
}

label.morador-field {
    display: grid;
    grid-template-rows: minmax(13px, auto) 28px;
    gap: 3px;
    align-items: stretch;
    margin: 0;
}

.morador-field-fracao {
    grid-area: fracao;
}

.morador-field-email {
    grid-area: email;
}

.morador-field-nif {
    grid-area: nif;
}

.morador-field-telemovel {
    grid-area: telemovel;
}

.morador-field-percentagem {
    grid-area: percentagem;
}

.morador-card-fields span {
    display: block;
    min-height: 13px;
    color: var(--app-muted);
    font-size: 0.62rem;
    font-weight: 850;
    line-height: 1.1;
    text-transform: uppercase;
}

.morador-card .form-control {
    width: 100%;
    min-height: 28px;
    padding: 4px 7px;
    font-size: 0.82rem;
}

.morador-card select.form-control {
    padding-right: 22px;
}

.compact-toggle-row {
    margin: 3px 0 0;
    gap: 8px;
    font-size: 0.78rem;
}

.morador-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
}

.optional-compact-field {
    display: none;
}

.empty-state {
    display: grid;
    gap: 6px;
    padding: 16px;
    border: 1px dashed #b8d4ff;
    border-radius: 8px;
    color: var(--app-muted);
    background: #f4f8ff;
}

.empty-state strong {
    color: var(--app-primary-strong);
}

.unit-blue {
    border-left-color: var(--app-primary);
}

.unit-green {
    border-left-color: #16805d;
}

.unit-amber {
    border-left-color: var(--app-amber);
}

.unit-rose {
    border-left-color: var(--app-rose);
}

.unit-cyan {
    border-left-color: var(--app-cyan);
}

.unit-slate {
    border-left-color: #64748b;
}

.strategy-card {
    min-height: 136px;
    padding: 16px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

.strategy-card strong {
    display: block;
    margin-bottom: 8px;
    color: var(--app-primary-strong);
    font-weight: 900;
}

.strategy-card p {
    margin: 0;
    color: var(--app-muted);
    font-size: 0.92rem;
    font-weight: 650;
}

.fraction-list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.fraction-list div {
    min-height: 68px;
    padding: 12px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

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

.fraction-list span {
    margin-top: 4px;
    color: var(--app-muted);
    font-size: 0.84rem;
    font-weight: 750;
}

.finance-onboarding-layout {
    align-items: start;
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
}

.finance-onboarding-form .two-cols {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.finance-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 18px;
    padding: 6px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

.finance-tab-button {
    min-height: 44px;
    padding: 8px 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--app-muted);
    background: transparent;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.finance-tab-button:hover {
    color: var(--app-primary-strong);
    background: #eef6ff;
}

.finance-tab-button.is-active {
    border-color: #b8d4ff;
    color: #ffffff;
    background: var(--app-primary);
    box-shadow: 0 10px 22px rgba(20, 91, 219, 0.18);
}

.finance-tab-panel {
    display: none;
}

.finance-tab-panel.is-active {
    display: grid;
    gap: 18px;
}

.finance-table-wrap {
    display: grid;
    gap: 12px;
    overflow-x: auto;
    padding: 14px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

.finance-table-wrap h3 {
    margin: 0;
    color: var(--app-primary-strong);
    font-size: 1rem;
    font-weight: 900;
}

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

.finance-form-check {
    align-self: end;
    min-height: 48px;
    padding: 10px 12px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

.finance-apply-field {
    align-self: end;
    justify-content: end;
}

.finance-apply-field .btn {
    min-height: 48px;
}

.quota-type-cell {
    color: var(--app-primary-strong);
    font-size: 0.8rem;
    font-weight: 900;
}

.quota-row-applied {
    background: #f0fdf7;
}

.quota-applied-badge {
    display: inline-grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #f8fafc;
    color: var(--app-muted);
    font-size: 0.85rem;
    font-weight: 900;
}

.quota-applied-badge.is-applied {
    border-color: #20a675;
    background: #dcfce7;
    color: #047857;
}

.finance-agreement-panel {
    display: grid;
    gap: 14px;
    margin-top: 18px;
    padding: 16px;
    border: 1px solid #b8d4ff;
    border-radius: 8px;
    background: #eef6ff;
}

.finance-agreement-panel h3 {
    margin: 0;
    color: var(--app-primary-strong);
    font-size: 1rem;
    font-weight: 900;
}

.finance-reserve-panel {
    display: grid;
    gap: 14px;
    margin-top: 18px;
    padding: 16px;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    background: #f5f9ff;
}

.finance-reserve-panel h3 {
    margin: 0;
    color: var(--app-primary-strong);
    font-size: 1rem;
    font-weight: 900;
}

.reserve-config-grid {
    display: grid;
    grid-template-columns: minmax(260px, 1.2fr) minmax(180px, 0.8fr);
    gap: 12px;
    align-items: start;
}

.reserve-config-grid .form-field {
    min-width: 0;
}

.reserve-active-field,
.reserve-header-toggle {
    min-height: 48px;
    padding: 10px 12px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
}

.reserve-header-toggle {
    min-width: 250px;
    border-color: #9cc3ff;
    background: #eaf3ff;
    color: var(--app-primary-strong);
    font-weight: 900;
}

.reserve-observations-field {
    grid-column: 1 / -1;
}

.reserve-application-note {
    border-color: #b8d4ff;
    background: #eef6ff;
}

.finance-reserve-rule-notice {
    display: none;
    grid-column: 1 / -1;
    padding: 10px 12px;
    border: 1px solid #f6c453;
    border-radius: 8px;
    background: #fff8df;
    color: #7a4b00;
}

.finance-reserve-rule-notice.is-visible {
    display: grid;
    gap: 3px;
}

.finance-reserve-rule-notice strong {
    color: #7a4b00;
    font-size: 0.8rem;
    font-weight: 900;
    text-transform: uppercase;
}

.finance-reserve-rule-notice span {
    color: #5f4a18;
    font-size: 0.9rem;
}

.reserve-config-grid .form-control:disabled {
    border-color: #dbe5f0;
    color: #94a3b8;
    background: #eef3f9;
}

.onboarding-form-panel .finance-tab-panel {
    display: none !important;
}

.onboarding-form-panel .finance-tab-panel.is-active {
    display: grid !important;
    gap: 18px;
}

.finance-section-header {
    align-items: start;
    gap: 12px;
}

.finance-section-header .btn {
    white-space: nowrap;
}

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

.agreement-grid .form-field:last-child {
    grid-column: span 3;
}

.finance-fraction-table {
    width: 100%;
    min-width: 880px;
    border-collapse: collapse;
}

.finance-table-total {
    display: grid;
    gap: 2px;
    min-width: 150px;
    padding: 8px 12px;
    border: 1px solid #b8d4ff;
    border-radius: 8px;
    background: #eef6ff;
    color: var(--app-primary-strong);
    text-align: right;
}

.finance-table-total span {
    color: var(--app-muted);
    font-size: 0.7rem;
    font-weight: 900;
    text-transform: uppercase;
}

.finance-table-total strong {
    font-size: 1rem;
    font-weight: 900;
}

.finance-fraction-table th,
.finance-fraction-table td {
    padding: 8px;
    border-bottom: 1px solid var(--app-line);
    text-align: left;
    vertical-align: middle;
}

.finance-fraction-table th {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.finance-fraction-table td {
    color: var(--app-ink);
    font-size: 0.9rem;
    font-weight: 700;
}

.finance-fraction-table .form-control {
    min-height: 34px;
    padding: 6px 8px;
}

.finance-row-selector {
    display: inline-grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #ffffff;
}

.finance-row-selector input {
    width: 16px;
    height: 16px;
}

.finance-submit-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
}

.finance-check {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    color: var(--app-muted);
    font-size: 0.9rem;
    font-weight: 850;
}

.finance-check input {
    width: 17px;
    height: 17px;
}

.finance-emission-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: flex-end;
}

.finance-summary-panel {
    align-self: start;
}

.finance-total-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 14px;
}

.finance-total-grid div {
    display: grid;
    gap: 3px;
    padding: 10px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: #f8fbff;
}

.finance-total-grid span {
    color: var(--app-muted);
    font-size: 0.7rem;
    font-weight: 900;
    text-transform: uppercase;
}

.finance-total-grid strong {
    color: var(--app-primary-strong);
    font-weight: 950;
}

.finance-summary-block {
    display: grid;
    gap: 8px;
    padding: 12px 0;
    border-top: 1px solid var(--app-line);
}

.finance-summary-block:first-of-type {
    border-top: 0;
    padding-top: 0;
}

.finance-summary-block h3 {
    margin: 0;
    color: var(--app-primary-strong);
    font-size: 0.95rem;
    font-weight: 900;
}

.finance-summary-item {
    display: grid;
    gap: 3px;
    padding: 10px;
    border: 1px solid var(--app-line);
    border-left: 5px solid var(--app-primary);
    border-radius: 8px;
    background: #ffffff;
}

.finance-summary-item-readonly {
    border-color: #bfdbfe;
    border-left-color: #38bdf8;
    background: #f5f9ff;
}

.finance-summary-item-readonly summary strong::after {
    content: "Automatico";
    display: inline-flex;
    margin-left: 8px;
    padding: 2px 7px;
    border-radius: 999px;
    color: var(--app-primary-strong);
    background: #dbeafe;
    font-size: 0.66rem;
    font-weight: 900;
    text-transform: uppercase;
}

.finance-summary-item-readonly .form-control[readonly] {
    border-color: #dbe5f0;
    color: var(--app-primary-strong);
    background: #eef6ff;
    font-weight: 900;
}

.finance-summary-item strong {
    color: var(--app-ink);
    font-weight: 900;
}

.finance-summary-item span {
    color: var(--app-muted);
    font-size: 0.82rem;
    font-weight: 750;
}

.finance-summary-item summary {
    cursor: pointer;
}

.finance-summary-item summary::marker {
    color: var(--app-primary);
}

.finance-inline-editor {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--app-line);
}

.finance-inline-editor label {
    display: grid;
    gap: 3px;
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.finance-inline-editor .form-control {
    min-height: 34px;
    padding: 6px 8px;
    font-size: 0.86rem;
    text-transform: none;
}

.finance-inline-editor .full-row {
    grid-column: 1 / -1;
}

.finance-inline-editor .btn {
    align-self: end;
    justify-self: end;
}

.finance-delete-form {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
}

.btn-danger-soft {
    border: 1px solid #fecaca;
    color: #991b1b;
    background: #fff1f2;
}

.btn-danger-soft:hover {
    border-color: #fca5a5;
    color: #7f1d1d;
    background: #ffe4e6;
}

.rule-detail-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 8px;
    margin-top: 9px;
    padding-top: 9px;
    border-top: 1px solid var(--app-line);
}

.rule-detail-list label {
    display: grid;
    grid-template-columns: minmax(70px, 1fr) minmax(90px, 120px);
    gap: 8px;
    align-items: center;
    color: var(--app-muted);
    font-size: 0.8rem;
    font-weight: 850;
}

.rule-detail-list .form-control {
    min-height: 32px;
    padding: 5px 7px;
    font-size: 0.84rem;
}

.finance-history-note {
    display: grid;
    gap: 4px;
    padding: 12px;
    border: 1px dashed #b8d4ff;
    border-radius: 8px;
    color: var(--app-muted);
    background: #f4f8ff;
    font-size: 0.9rem;
    font-weight: 700;
}

.finance-history-note strong {
    color: var(--app-primary-strong);
}

.invites-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(300px, 0.7fr);
    gap: 18px;
    align-items: start;
}

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

.invite-select-all {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid #b8d4ff;
    border-radius: 8px;
    background: #eef6ff;
    color: var(--app-primary-strong);
    font-size: 0.9rem;
    font-weight: 900;
}

.invite-select-all input,
.invite-selector input {
    width: 18px;
    height: 18px;
    accent-color: var(--app-primary);
}

.invite-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, auto);
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--app-line);
    border-left: 5px solid var(--app-primary);
    border-radius: 8px;
    background: #ffffff;
}

.invite-main {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
}

.invite-selector {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.invite-card-warning {
    border-left-color: #d97706;
    background: #fff8e7;
}

.invite-card strong,
.invite-card span {
    display: block;
}

.invite-card span {
    color: var(--app-muted);
    font-size: 0.86rem;
    font-weight: 750;
}

.invite-status {
    width: max-content;
    margin-bottom: 3px;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 950;
    text-transform: uppercase;
}

.invite-status-ready {
    color: #0f5d43;
    background: #dff8ed;
}

.invite-status-missing {
    color: #92400e;
    background: #fdecc8;
}

.invites-summary-panel {
    display: grid;
    gap: 14px;
}

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

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

    .landing-hero,
    .feature-grid,
    .pricing-grid,
    .workflow-list,
    .register-layout,
    .strategy-actions,
    .strategy-grid,
    .fraction-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hero-copy {
        max-width: none;
    }

    .hero-image-card img {
        max-height: 520px;
    }

    .onboarding-layout,
    .tenant-summary,
    .moradores-layout,
    .finance-onboarding-layout,
    .profile-layout,
    .portal-profile-layout {
        grid-template-columns: 1fr;
    }

    .onboarding-sidebar {
        position: static;
    }
}

@media (max-width: 1280px) and (min-width: 901px) {
    .landing-hero {
        grid-template-columns: minmax(340px, 0.72fr) minmax(460px, 1.28fr);
        gap: 36px;
        padding-inline: 34px;
    }

    .hero-copy h1 {
        font-size: clamp(3rem, 4.7vw, 4.7rem);
    }

    .hero-copy p {
        font-size: 1.05rem;
        line-height: 1.6;
    }
}

@media (max-width: 640px) {
    .morador-card-fields {
        grid-template-areas:
            "fracao email"
            "nif email"
            "telemovel percentagem";
        grid-template-columns: minmax(96px, 0.8fr) minmax(0, 1.2fr);
    }
}

@media (max-width: 460px) {
    .morador-card-fields {
        grid-template-areas:
            "fracao"
            "email"
            "nif"
            "telemovel"
            "percentagem";
        grid-template-columns: 1fr;
    }
}

@media (max-width: 780px) {
    .documents-filter-form {
        grid-template-columns: 1fr;
    }

    .app-shell {
        grid-template-columns: 1fr;
    }

    .app-sidebar {
        position: static;
        height: auto;
    }

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

    .sidebar-section {
        grid-column: 1 / -1;
    }

    .app-main {
        padding: 18px;
    }

    .portal-shell {
        grid-template-columns: 1fr;
    }

    .portal-sidebar {
        position: static;
        height: auto;
    }

    .portal-main {
        padding: 18px;
    }

    .portal-header {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .portal-brand-slot,
    .portal-header h1 {
        justify-self: start;
        text-align: left;
    }

    .portal-kpi-grid,
    .portal-content-grid,
    .portal-profile-grid,
    .form-grid.two-columns {
        grid-template-columns: 1fr;
    }

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

    .portal-timeline-item {
        align-items: flex-start;
        flex-direction: column;
    }

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

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

    .dashboard-grid,
    .operation-grid,
    .admin-workspace,
    .admin-form-grid,
    .publication-form-grid,
    .publication-admin-card,
    .portal-publications-layout,
    .admin-edit-grid,
    .admin-meta-grid,
    .invite-admin-card,
    .people-form-grid,
    .fraction-edit-grid,
    .resident-edit-grid {
        grid-template-columns: 1fr;
    }

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

    .dashboard-hero-actions {
        justify-content: flex-start;
    }

    .admin-form-panel {
        position: static;
    }

    .invite-admin-actions {
        justify-self: stretch;
    }

    .invite-admin-actions .btn,
    .invite-admin-actions form {
        width: 100%;
    }

    .landing-nav {
        position: static;
        align-items: flex-start;
        flex-direction: column;
        min-height: 0;
        padding-top: 8px;
        padding-bottom: 10px;
    }

    .landing-nav-links {
        width: 100%;
        flex-wrap: wrap;
        gap: 10px;
    }

    .landing-hero,
    .feature-grid,
    .pricing-grid,
    .workflow-list,
    .register-layout,
    .form-grid,
    .moradores-form .form-grid,
    .import-form,
    .moradores-filter,
    .morador-card-head,
    .invites-layout,
    .invite-card {
        grid-template-columns: 1fr;
    }

    .moradores-filter label {
        grid-column: auto;
    }

    .landing-hero {
        min-height: auto;
    }

    .hero-image-card img {
        height: auto;
        max-height: none;
    }

    .signup-panel {
        align-items: flex-start;
        flex-direction: column;
    }

    .login-shell {
        grid-template-columns: 1fr;
    }

    .login-panel {
        padding: 24px;
    }

    .login-form {
        width: 100%;
    }

    .login-visual {
        min-height: 320px;
    }

    .login-visual img {
        min-height: 320px;
    }

    .tenant-summary dl,
    .strategy-actions,
    .strategy-grid,
    .fraction-list,
    .door-row,
    .building-floor,
    .block-grid,
    .finance-tabs,
    .finance-onboarding-form .two-cols,
    .base-value-tools,
    .reserve-config-grid,
    .agreement-grid,
    .finance-total-grid,
    .finance-inline-editor,
    .rule-detail-list,
    .onboarding-form .form-grid {
        grid-template-columns: 1fr;
    }

    .finance-section-header {
        align-items: stretch;
        flex-direction: column;
    }

    .finance-section-header .btn,
    .finance-inline-editor .btn {
        width: 100%;
    }

    .building-unit {
        grid-template-areas:
            "porta"
            "referencia"
            "permilagem"
            "action";
        grid-template-columns: 1fr;
    }

    .unit-door-field .form-control {
        min-height: 46px;
    }

    .agreement-grid .form-field:last-child {
        grid-column: auto;
    }

    .delete-unit-button {
        width: 100%;
    }
}
