/* Society Orbit phase-one design system.
   This file intentionally loads after app.css and normalises the complete
   shared Blazor UI without changing any business workflow or stored data. */

:root {
    --so-canvas: #f4f7f6;
    --so-surface: #ffffff;
    --so-surface-subtle: #f8faf9;
    --so-surface-selected: #e8f3ef;
    --so-text: #16221e;
    --so-text-muted: #60716a;
    --so-border: #dce5e1;
    --so-border-strong: #c7d5cf;
    --so-primary: #075c47;
    --so-primary-hover: #064b3b;
    --so-primary-soft: #e6f3ee;
    --so-danger: #b7352d;
    --so-warning: #9b6518;
    --so-success: #19734f;
    --so-focus: #2e7dca;
    --so-radius-sm: 8px;
    --so-radius-md: 12px;
    --so-radius-lg: 16px;
    --so-shadow-sm: 0 1px 2px rgba(16, 38, 30, .05);
    --so-shadow-md: 0 10px 28px rgba(16, 38, 30, .08);
    --so-content: 1440px;
    color-scheme: light;
}

html {
    background: var(--so-canvas);
    scroll-behavior: smooth;
}

body {
    background: var(--so-canvas);
    color: var(--so-text);
    font-family: Inter, "Segoe UI", system-ui, sans-serif;
    line-height: 1.5;
}

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

button,
a,
input,
select,
textarea {
    outline: none;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    box-shadow: 0 0 0 3px rgba(46, 125, 202, .24) !important;
    outline: 2px solid var(--so-focus) !important;
    outline-offset: 1px;
}

button:disabled,
input:disabled,
select:disabled,
textarea:disabled {
    cursor: not-allowed;
    opacity: .58;
}

h1,
h2,
h3 {
    color: var(--so-text);
    font-weight: 700;
    letter-spacing: -.02em;
}

h1 { font-size: clamp(1.45rem, 2.1vw, 1.9rem); line-height: 1.25; }
h2 { font-size: clamp(1.08rem, 1.5vw, 1.28rem); line-height: 1.3; }
h3 { font-size: 1rem; line-height: 1.4; }

.muted,
.small,
.brand-subtitle,
.page-intro p,
.module-workspace-hint,
.module-workspace-option small,
.field > small,
.field > span,
.admin-row small {
    color: var(--so-text-muted) !important;
}

.app-shell {
    background: var(--so-canvas);
    min-height: 100svh;
}

.topbar {
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid var(--so-border);
    box-shadow: none;
    height: 72px;
    padding: 10px clamp(14px, 2.5vw, 30px);
}

.brand-row .avatar {
    background: var(--so-primary);
    border: 0;
    border-radius: var(--so-radius-sm);
    color: #fff;
    font-size: 13px;
    height: 42px;
    width: 42px;
}

.brand-name {
    color: var(--so-primary);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.25;
}

.brand-subtitle {
    display: block;
    max-width: min(52vw, 580px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.top-actions {
    gap: 8px;
}

.top-role-label {
    color: var(--so-text-muted);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.role-chip,
.icon-button,
.round-button {
    background: var(--so-surface);
    border: 1px solid var(--so-border);
    border-radius: var(--so-radius-sm);
    color: var(--so-text);
}

.role-chip {
    align-items: center;
    display: inline-flex;
    gap: 6px;
    min-height: 40px;
    padding: 0 12px;
}

.role-chip:hover,
.icon-button:hover,
.round-button:hover {
    background: var(--so-surface-selected);
    border-color: var(--so-border-strong);
    color: var(--so-primary);
}

.app-status-banner {
    align-items: center;
    background: #eef7f3;
    border: 1px solid #cce3da;
    border-radius: var(--so-radius-sm);
    color: #174f3e;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    margin: 12px auto 0;
    max-width: calc(var(--so-content) - 36px);
    padding: 10px 14px;
    width: calc(100% - 28px);
}

.screen {
    gap: 20px;
    max-width: var(--so-content);
    padding: 24px clamp(14px, 2.4vw, 32px) 112px;
    width: 100%;
}

.screen.narrow { max-width: 860px; }
.screen.wide { max-width: var(--so-content); }

.page-intro {
    align-items: flex-end;
    background: transparent;
    border: 0;
    box-shadow: none;
    display: flex;
    gap: 18px;
    justify-content: space-between;
    margin: 0;
    padding: 2px 0 0;
}

.page-intro h1 { margin: 0; }
.page-intro p { margin-top: 4px; max-width: 760px; }

.tenant-panel,
.card,
.workspace-panel,
.admin-editor,
.hero-card,
.detail-strip,
.report-viewer-card,
.record-section,
.report-preview,
.modal-card {
    background: var(--so-surface);
    border: 1px solid var(--so-border);
    border-radius: var(--so-radius-md);
    box-shadow: var(--so-shadow-sm);
}

.card:hover,
.web-panel:hover,
.web-kpi:hover,
.tenant-panel:hover {
    box-shadow: var(--so-shadow-sm);
    transform: none;
}

.workspace-panel,
.admin-editor,
.record-section {
    padding: clamp(16px, 2vw, 22px);
}

.tenant-panel {
    background: var(--so-surface);
    border-left: 1px solid var(--so-border);
    padding: 16px 18px;
}

.tenant-panel::before { display: none; }

.label,
.overline {
    color: var(--so-primary);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
}

.section-title {
    align-items: center;
    border-bottom: 1px solid var(--so-border);
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
    min-height: 46px;
    padding-bottom: 12px;
}

.section-title h2,
.section-title h3 {
    align-items: center;
    display: inline-flex;
    gap: 8px;
    margin: 0;
}

.section-title .material-symbols-outlined { color: var(--so-primary); }

.primary-button,
.danger-button,
.orange-button,
.secondary-button,
.outline-danger,
.hero-card button,
.sos-card button,
.report-actions button {
    border-radius: var(--so-radius-sm);
    box-shadow: none;
    font-size: 13px;
    font-weight: 650;
    min-height: 40px;
    padding: 8px 13px;
}

.primary-button,
.hero-card button {
    background: var(--so-primary);
    border: 1px solid var(--so-primary);
    color: #fff;
}

.primary-button:hover,
.hero-card button:hover {
    background: var(--so-primary-hover);
    border-color: var(--so-primary-hover);
}

.secondary-button {
    background: var(--so-surface);
    border: 1px solid var(--so-border-strong);
    color: var(--so-text);
}

.secondary-button:hover {
    background: var(--so-surface-selected);
    border-color: #9fb8ae;
    color: var(--so-primary);
}

.danger-button,
.outline-danger {
    background: #fff;
    border: 1px solid #e7b9b5;
    color: var(--so-danger);
}

.danger-button:hover,
.outline-danger:hover { background: #fff3f2; }

.field {
    color: var(--so-text);
    font-size: 12px;
    font-weight: 650;
    gap: 6px;
}

.field input,
.field select,
.field textarea,
.tenant-controls select,
.web-society-picker select,
.top-society-picker select,
.search-box {
    background: var(--so-surface);
    border: 1px solid var(--so-border-strong);
    border-radius: var(--so-radius-sm);
    color: var(--so-text);
    min-height: 42px;
    padding: 9px 11px;
}

.field textarea { min-height: 96px; resize: vertical; }

.field input:hover,
.field select:hover,
.field textarea:hover { border-color: #9fb8ae; }

.form-grid,
.form-grid.two,
.form-grid.four {
    gap: 14px 16px;
}

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

.badge,
.status-chip {
    border: 1px solid var(--so-border);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 650;
    padding: 4px 8px;
}

.badge.success,
.status-chip.success { background: #e8f5ef; border-color: #c8e5d8; color: var(--so-success); }
.badge.warning,
.status-chip.warning,
.status-chip.warn { background: #fff6e6; border-color: #ecd7ae; color: var(--so-warning); }
.badge.danger,
.status-chip.danger { background: #fff0ef; border-color: #edc7c4; color: var(--so-danger); }
.badge.muted { background: var(--so-surface-subtle); color: var(--so-text-muted); }

.module-workspace-nav {
    background: var(--so-surface);
    border: 1px solid var(--so-border);
    border-radius: var(--so-radius-md);
    box-shadow: var(--so-shadow-sm);
    margin-bottom: 18px;
    padding: 14px;
}

.module-workspace-heading {
    align-items: center;
    margin-bottom: 10px;
}

.module-workspace-heading h2 {
    font-size: 1rem;
    margin: 1px 0 0;
}

.module-workspace-options {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 2px 2px 7px;
    scroll-snap-type: x proximity;
    scrollbar-color: #b8c9c2 transparent;
    scrollbar-width: thin;
}

.module-workspace-option {
    background: var(--so-surface-subtle);
    border: 1px solid var(--so-border);
    border-radius: var(--so-radius-sm);
    flex: 0 0 230px;
    gap: 9px;
    grid-template-columns: 34px minmax(0, 1fr) 18px;
    min-height: 58px;
    padding: 9px 10px;
    scroll-snap-align: start;
}

.module-workspace-option:hover {
    background: #f1f7f4;
    border-color: #a8c4b8;
    box-shadow: none;
    transform: none;
}

.module-workspace-option.active {
    background: var(--so-primary-soft);
    border-color: #8bb5a5;
    box-shadow: inset 3px 0 0 var(--so-primary);
}

.module-workspace-option > .material-symbols-outlined:first-child {
    background: transparent;
    color: var(--so-primary);
    height: 32px;
    width: 32px;
}

.module-workspace-option strong {
    font-size: 12px;
    line-height: 1.3;
}

.module-workspace-option small {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    font-size: 10px;
    line-height: 1.3;
    overflow: hidden;
}

.module-workspace-option .option-arrow { font-size: 17px; }

.data-table,
.report-preview,
.report-viewer-card {
    border: 1px solid var(--so-border);
    border-radius: var(--so-radius-md);
    box-shadow: none;
    overflow: auto;
}

.table-head,
.web-table th,
.report-table th {
    background: #f2f6f4;
    color: #4e625a;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .025em;
    text-transform: none;
}

.table-row,
.web-table td,
.web-table th,
.report-table td,
.report-table th {
    border-color: var(--so-border);
}

.table-row {
    background: var(--so-surface);
    box-shadow: none;
    min-height: 50px;
}

.table-row:hover,
.web-table tbody tr:hover,
.report-table tbody tr:hover { background: #f7faf8; }

.admin-row {
    align-items: center;
    border-bottom: 1px solid var(--so-border);
    border-radius: 0;
    gap: 12px;
    padding: 12px 2px;
}

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

.empty-state,
.empty-card {
    align-items: center;
    background: var(--so-surface-subtle);
    border: 1px dashed var(--so-border-strong);
    box-shadow: none;
    color: var(--so-text-muted);
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 170px;
    padding: 28px;
    text-align: center;
}

.empty-state > .material-symbols-outlined,
.empty-card > .material-symbols-outlined {
    color: var(--so-primary);
    font-size: 34px;
    margin-bottom: 8px;
}

.form-error {
    background: #fff2f1;
    border: 1px solid #e8bbb7;
    border-radius: var(--so-radius-sm);
    color: #922a24;
}

.modal-backdrop {
    align-items: center;
    background: rgba(12, 28, 22, .52);
    backdrop-filter: blur(4px);
    padding: 18px;
}

.modal-card {
    box-shadow: 0 24px 70px rgba(12, 28, 22, .22);
    max-height: min(88svh, 920px);
    overflow: auto;
    padding: clamp(16px, 2.4vw, 24px);
}

.bottom-nav {
    background: rgba(255, 255, 255, .97);
    border-top: 1px solid var(--so-border);
    box-shadow: 0 -8px 24px rgba(16, 38, 30, .07);
}

.nav-item {
    border-radius: var(--so-radius-sm);
    color: var(--so-text-muted);
}

.nav-item.active {
    background: var(--so-primary-soft);
    color: var(--so-primary);
}

/* Executive dashboard shell */
.web-dashboard {
    background: var(--so-canvas);
    color: var(--so-text);
    grid-template-columns: 250px minmax(0, 1fr);
}

.web-sidebar {
    background: #0a4538;
    border: 0;
    box-shadow: none;
    padding: 18px 14px;
}

.web-brand {
    border-bottom: 1px solid rgba(255, 255, 255, .14);
}

.web-brand strong,
.web-brand span,
.web-quick-actions h3 { color: #fff; }

.web-brand span { opacity: .72; }

.web-logo.web-logo-mark {
    background: #fff;
    box-shadow: none;
    color: var(--so-primary);
}

.web-nav button,
.web-quick-actions button {
    color: rgba(255, 255, 255, .82);
    min-height: 41px;
}

.web-nav button:hover,
.web-quick-actions button:hover {
    background: rgba(255, 255, 255, .1);
    border-color: transparent;
    color: #fff;
}

.web-nav button.active {
    background: #fff;
    box-shadow: none;
    color: var(--so-primary);
}

.web-quick-actions {
    background: rgba(255, 255, 255, .07);
    border: 1px solid rgba(255, 255, 255, .13);
    box-shadow: none;
}

.web-topbar {
    background: rgba(255, 255, 255, .97);
    border-bottom: 1px solid var(--so-border);
    box-shadow: none;
    height: 72px;
}

.web-content { padding: 24px clamp(18px, 2.6vw, 36px) 34px; }

.web-search,
.web-kpi,
.web-panel {
    background: var(--so-surface);
    border: 1px solid var(--so-border);
    box-shadow: var(--so-shadow-sm);
}

.web-kpi { min-height: 102px; padding: 15px; }
.web-kpi strong { font-size: 21px; }
.web-panel { border-radius: var(--so-radius-md); }
.web-panel-head { background: var(--so-surface); border-bottom: 1px solid var(--so-border); }

.web-header-actions button,
.web-filters button,
.web-panel-head button,
.web-user button {
    background: var(--so-surface);
    border: 1px solid var(--so-border);
    border-radius: var(--so-radius-sm);
}

.web-page-title h1 { font-size: 24px; }

/* Desktop module navigation becomes a calm left rail. */
@media (min-width: 1100px) {
    .app-shell {
        display: grid;
        grid-template-columns: 226px minmax(0, 1fr);
        grid-template-rows: 72px auto minmax(0, 1fr);
    }

    .app-shell > .topbar {
        grid-column: 1 / -1;
        grid-row: 1;
        left: 0;
        position: fixed;
        right: 0;
        top: 0;
        width: 100%;
        z-index: 40;
    }

    .app-shell > .app-status-banner {
        grid-column: 2;
        grid-row: 2;
        margin-left: 24px;
        margin-right: 24px;
        width: auto;
    }

    .app-shell > main,
    .app-shell > .operations-hub {
        grid-column: 2;
        grid-row: 3;
        min-width: 0;
    }

    .app-shell > .bottom-nav {
        align-items: stretch;
        align-self: stretch;
        background: #0a4538;
        border: 0;
        box-shadow: none;
        flex-direction: column;
        gap: 4px;
        grid-column: 1;
        grid-row: 2 / 4;
        bottom: 0;
        height: auto;
        justify-content: flex-start;
        left: auto;
        overflow-y: auto;
        padding: 18px 12px;
        position: fixed;
        right: auto;
        top: 72px;
        width: 226px;
        z-index: 30;
    }

    .app-shell > .bottom-nav::before {
        color: rgba(255, 255, 255, .55);
        content: "WORKSPACES";
        font-size: 10px;
        font-weight: 700;
        letter-spacing: .08em;
        padding: 0 10px 8px;
    }

    .app-shell > .bottom-nav .nav-item {
        align-items: center;
        color: rgba(255, 255, 255, .8);
        flex: 0 0 auto;
        flex-direction: row;
        font-size: 13px;
        gap: 10px;
        justify-content: flex-start;
        min-height: 42px;
        padding: 8px 11px;
        width: 100%;
    }

    .app-shell > .bottom-nav .nav-item:hover {
        background: rgba(255, 255, 255, .1);
        color: #fff;
    }

    .app-shell > .bottom-nav .nav-item.active {
        background: #fff;
        color: var(--so-primary);
    }

    .app-shell > .bottom-nav .material-symbols-outlined { font-size: 20px; }
    .screen { padding-bottom: 42px; }
}

@media (max-width: 1099px) {
    .module-workspace-hint { display: none; }
    .web-dashboard { display: block; }
    .web-sidebar {
        background: #0a4538;
        border-radius: 0;
        padding: 8px;
    }
}

@media (max-width: 700px) {
    .topbar {
        height: 64px;
        padding: 8px 12px;
    }

    .brand-row .avatar { height: 38px; width: 38px; }
    .brand-name { font-size: 14px; }
    .brand-subtitle { max-width: 45vw; }
    .top-role-label { display: none; }
    .role-chip { min-height: 38px; padding: 0 9px; }
    .role-chip .role-chip-text { display: none; }
    .top-society-picker { display: none; }

    .screen {
        gap: 16px;
        padding: 16px 12px calc(92px + env(safe-area-inset-bottom));
    }

    .page-intro { align-items: flex-start; flex-direction: column; }

    .module-workspace-nav {
        margin-left: -12px;
        margin-right: -12px;
        padding: 12px;
        border-left: 0;
        border-radius: 0;
        border-right: 0;
    }

    .module-workspace-heading { display: block; margin-bottom: 8px; }
    .module-workspace-heading .overline { display: none; }
    .module-workspace-option { flex-basis: 196px; min-height: 54px; }

    .section-title { align-items: flex-start; }
    .section-title > .two-actions { width: 100%; }

    .two-actions > button,
    .report-actions > button { flex: 1 1 140px; }

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

    .modal-backdrop { align-items: flex-end; padding: 0; }
    .modal-card {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        max-height: 92svh;
        width: 100%;
    }

    .bottom-nav {
        height: calc(70px + env(safe-area-inset-bottom));
        justify-content: flex-start;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 7px 8px calc(7px + env(safe-area-inset-bottom));
        scrollbar-width: none;
    }

    .bottom-nav::-webkit-scrollbar { display: none; }
    .nav-item { flex: 0 0 72px; }

    .web-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .web-kpi { min-height: 96px; }
}

@media (max-width: 420px) {
    .web-kpi-grid { grid-template-columns: 1fr; }
    .summary-grid,
    .quick-grid,
    .mini-grid { grid-template-columns: 1fr; }
}

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

/* Phase 2: focused accounting report workspace */
.financial-report-shell {
    align-items: start;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(230px, 270px) minmax(0, 1fr);
}

.financial-report-library {
    padding: 18px;
    position: sticky;
    top: 92px;
}

.financial-library-heading h2 { font-size: 19px; margin: 2px 0 6px; }
.financial-library-heading > p:last-child { color: var(--so-text-muted); font-size: 13px; margin: 0 0 14px; }
.financial-report-options { display: grid; gap: 7px; }

.financial-report-option {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 12px;
    color: var(--so-text);
    cursor: pointer;
    display: grid;
    gap: 10px;
    grid-template-columns: 28px minmax(0, 1fr) 20px;
    padding: 11px;
    text-align: left;
    width: 100%;
}

.financial-report-option:hover { background: var(--so-primary-soft); }
.financial-report-option.selected { background: var(--so-primary-soft); border-color: #abd2c5; color: var(--so-primary); }
.financial-report-option > .material-symbols-outlined:first-child { font-size: 22px; }
.financial-report-option strong { display: block; font-size: 13px; }
.financial-report-option small { color: var(--so-text-muted); display: block; font-size: 11px; line-height: 1.35; margin-top: 2px; }
.financial-report-option .option-arrow { font-size: 18px; opacity: .5; }
.financial-report-viewer { display: grid; gap: 14px; min-width: 0; }

.financial-filter-toolbar {
    align-items: end;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding: 14px 16px;
}

.financial-filter-fields { display: grid; flex: 1; gap: 10px; grid-template-columns: minmax(145px, .7fr) minmax(145px, .7fr) minmax(190px, 1.2fr); }
.financial-filter-toolbar .field { margin: 0; }
.financial-filter-toolbar .primary-button { white-space: nowrap; }

.financial-report-context {
    align-items: center;
    background: #f1f7f5;
    border: 1px solid #d5e6e0;
    border-radius: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    padding: 11px 15px;
}

.financial-report-context div { display: grid; gap: 2px; }
.financial-report-context div span { color: var(--so-text-muted); font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.financial-report-context div strong { font-size: 13px; }
.financial-report-context > .badge { margin-left: auto; }
.financial-statement-card { min-width: 0; }
.financial-report-title { align-items: flex-start; border-bottom: 1px solid var(--so-border); margin-bottom: 14px; padding-bottom: 14px; }
.financial-report-title h2 { margin: 2px 0; }

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

.financial-kpi-row > div { background: #f7faf9; border: 1px solid var(--so-border); border-radius: 10px; display: grid; gap: 3px; padding: 11px 13px; }
.financial-kpi-row span { color: var(--so-text-muted); font-size: 11px; }
.financial-kpi-row strong { font-size: 15px; }
.positive-text { color: #087454; }
.negative-text { color: #b42318; }

.ledger-drill-link {
    align-items: center;
    background: transparent;
    border: 0;
    color: var(--so-primary);
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-weight: 700;
    gap: 5px;
    padding: 0;
    text-align: left;
}

.ledger-drill-link:hover { text-decoration: underline; }
.ledger-drill-link .material-symbols-outlined { font-size: 15px; }
.financial-schedule-grid { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.financial-schedule-card { border: 1px solid var(--so-border); border-radius: 12px; overflow: hidden; }
.financial-schedule-card > header { align-items: center; background: #f7faf9; display: flex; justify-content: space-between; padding: 12px 14px; }
.financial-schedule-card .compact-list { padding: 5px 10px 10px; }
.financial-schedule-card .admin-row { border: 0; border-bottom: 1px solid var(--so-border); border-radius: 0; width: 100%; }
.financial-review-panel { padding: 0; }
.financial-review-panel summary { align-items: center; cursor: pointer; display: flex; font-weight: 700; gap: 8px; padding: 14px 16px; }
.financial-review-panel p { border-top: 1px solid var(--so-border); margin: 0; padding: 11px 16px; }
.ledger-drilldown-modal { min-width: min(760px, 80vw); }

@media (max-width: 900px) {
    .financial-report-shell { grid-template-columns: 1fr; }
    .financial-report-library { position: static; }
    .financial-library-heading > p:last-child { margin-bottom: 10px; }
    .financial-report-options { display: flex; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
    .financial-report-option { flex: 0 0 210px; }
    .financial-report-option small { display: none; }
    .financial-filter-toolbar { align-items: stretch; flex-direction: column; }
}

@media (max-width: 620px) {
    .financial-report-library { margin-left: -12px; margin-right: -12px; padding: 14px 12px; }
    .financial-filter-fields { grid-template-columns: 1fr 1fr; }
    .financial-filter-fields .field:last-child { grid-column: 1 / -1; }
    .financial-report-context { align-items: flex-start; display: grid; grid-template-columns: 1fr 1fr; }
    .financial-report-context > .badge { margin-left: 0; }
    .financial-report-title { gap: 12px; }
    .financial-report-title .report-actions { width: 100%; }
    .financial-kpi-row { grid-template-columns: 1fr; }
    .financial-schedule-grid { grid-template-columns: 1fr; }
    .ledger-drilldown-modal { min-width: 0; }
}

/* Phase 7: security desk and visitor management */
.security-command-summary { background: linear-gradient(120deg, #123f45, #0a5a49); }
.security-register-section { display: grid; gap: 12px; }
.security-register-section .section-title { margin-bottom: 0; }
.security-register-section .section-title p { margin: 3px 0 0; }
.security-register-list { max-height: 720px; overflow-y: auto; padding-right: 3px; }
.security-filter-toolbar { margin-bottom: 0; }
.parcel-filter-toolbar { grid-template-columns: minmax(250px,1fr) minmax(140px,190px); margin: 12px 0; }

.security-controls-workspace { display: grid; gap: 14px; }
.security-control-tabs { display: grid; gap: 8px; grid-template-columns: repeat(4,minmax(0,1fr)); }
.security-control-tabs button {
    align-items: center;
    background: #fff;
    border: 1px solid var(--so-border);
    border-radius: 11px;
    color: var(--so-text);
    cursor: pointer;
    display: grid;
    font: inherit;
    gap: 2px 9px;
    grid-template-columns: 30px minmax(0,1fr);
    min-height: 68px;
    padding: 10px 12px;
    text-align: left;
}
.security-control-tabs button.selected { background: var(--so-primary-soft); border-color: #8ebcac; box-shadow: inset 3px 0 0 var(--so-primary); color: var(--so-primary); }
.security-control-tabs .material-symbols-outlined { font-size: 23px; grid-row: 1 / 3; }
.security-control-tabs strong { font-size: 12px; }
.security-control-tabs small { color: var(--so-text-muted); font-size: 10px; }
.security-controls-workspace > .admin-editor { margin: 0; min-height: 250px; }
.security-inline-search { background: #f7faf9; margin: 14px 0 4px; max-width: 520px; }

@media (max-width: 760px) {
    .security-control-tabs { display: flex; overflow-x: auto; }
    .security-control-tabs button { flex: 0 0 165px; }
}

@media (max-width: 520px) {
    .security-command-summary { border-radius: 0; margin-left: -12px; margin-right: -12px; }
    .security-filter-toolbar,
    .parcel-filter-toolbar { grid-template-columns: 1fr; }
    .security-filter-toolbar .search-box,
    .parcel-filter-toolbar .search-box { grid-column: auto; }
    .security-register-list { max-height: none; overflow: visible; }
    .security-control-tabs { margin-left: -4px; margin-right: -4px; }
}

/* Phase 3: organisation-wide report centre */
.report-centre-shell {
    align-items: start;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(260px, 300px) minmax(0, 1fr);
    min-width: 0;
}

.report-centre-library {
    max-height: calc(100vh - 112px);
    overflow: hidden;
    padding: 0;
    position: sticky;
    top: 92px;
}

.report-library-header { padding: 18px 18px 12px; }
.report-library-header h2 { font-size: 19px; margin: 2px 0 5px; }
.report-library-header > p:last-child { color: var(--so-text-muted); font-size: 12px; margin: 0; }

.report-library-search,
.report-preview-controls label {
    align-items: center;
    background: var(--so-surface);
    border: 1px solid var(--so-border-strong);
    border-radius: 10px;
    display: flex;
    gap: 7px;
}

.report-library-search { margin: 0 18px 12px; padding: 0 10px; }
.report-library-search .material-symbols-outlined,
.report-preview-controls .material-symbols-outlined { color: var(--so-text-muted); font-size: 19px; }
.report-library-search input,
.report-preview-controls input { background: transparent; border: 0; min-height: 40px; outline: 0; width: 100%; }

.report-category-list {
    border-bottom: 1px solid var(--so-border);
    border-top: 1px solid var(--so-border);
    display: grid;
    gap: 2px;
    padding: 9px 10px;
}

.report-category-button {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 9px;
    color: var(--so-text-muted);
    cursor: pointer;
    display: grid;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    gap: 8px;
    grid-template-columns: 22px minmax(0, 1fr) auto;
    min-height: 36px;
    padding: 6px 9px;
    text-align: left;
}

.report-category-button:hover { background: #f3f7f5; color: var(--so-text); }
.report-category-button.selected { background: var(--so-primary-soft); color: var(--so-primary); }
.report-category-button .material-symbols-outlined { font-size: 18px; }
.report-category-button small { background: #edf2f0; border-radius: 999px; color: var(--so-text-muted); font-size: 10px; min-width: 22px; padding: 2px 6px; text-align: center; }
.report-category-button.selected small { background: #fff; color: var(--so-primary); }

.report-library-list {
    max-height: 38vh;
    min-height: 122px;
    overflow-y: auto;
    padding: 8px 10px 12px;
}

.report-library-item {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 10px;
    color: var(--so-text);
    cursor: pointer;
    display: grid;
    gap: 9px;
    grid-template-columns: 28px minmax(0, 1fr) 18px;
    padding: 10px 8px;
    text-align: left;
    width: 100%;
}

.report-library-item:hover { background: #f4f8f6; }
.report-library-item.selected { background: var(--so-primary-soft); border-color: #b4d3c8; color: var(--so-primary); }
.report-library-item > .material-symbols-outlined:first-child { font-size: 20px; }
.report-library-item > .material-symbols-outlined:last-child { font-size: 17px; opacity: .55; }
.report-library-item strong { display: block; font-size: 12px; }
.report-library-item small { color: var(--so-text-muted); display: -webkit-box; font-size: 10px; line-height: 1.35; margin-top: 2px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
.report-library-no-results { color: var(--so-text-muted); padding: 18px 8px; text-align: center; }
.report-library-no-results p { font-size: 12px; margin: 5px 0; }
.report-centre-viewer { display: grid; gap: 14px; min-width: 0; }

.report-viewer-toolbar {
    align-items: center;
    display: flex;
    gap: 18px;
    justify-content: space-between;
    padding: 15px 17px;
}

.report-viewer-toolbar h2 { font-size: 19px; margin: 2px 0; }
.report-viewer-toolbar > div:first-child > p:last-child { color: var(--so-text-muted); font-size: 12px; margin: 0; }
.report-toolbar-actions { align-items: end; display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.report-toolbar-actions .primary-button,
.report-toolbar-actions .secondary-button { min-height: 42px; white-space: nowrap; }
.report-format-select { display: grid; gap: 3px; }
.report-format-select span { color: var(--so-text-muted); font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.report-format-select select { border: 1px solid var(--so-border-strong); border-radius: 9px; min-height: 42px; padding: 0 30px 0 10px; }

.report-download-ready {
    align-items: center;
    background: #eef9f4;
    border: 1px solid #b8ddce;
    border-radius: 12px;
    display: grid;
    gap: 10px;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    padding: 11px 13px;
}

.report-download-ready > .material-symbols-outlined { color: var(--so-primary); }
.report-download-ready strong,
.report-download-ready small { display: block; }
.report-download-ready small { color: var(--so-text-muted); font-size: 11px; margin-top: 2px; }
.report-download-ready .primary-button { min-height: 38px; }
.report-loading-state { padding: 40px 20px; text-align: center; }
.report-loading-state .material-symbols-outlined { animation: so-spin 1s linear infinite; color: var(--so-primary); font-size: 30px; }
.report-loading-state strong { display: block; margin-top: 8px; }
.report-loading-state p { color: var(--so-text-muted); margin: 4px 0 0; }
.report-error-state { align-items: center; display: grid; gap: 12px; grid-template-columns: 30px minmax(0, 1fr) auto; padding: 16px; }
.report-error-state > .material-symbols-outlined { color: #b42318; }
.report-error-state p { color: var(--so-text-muted); margin: 3px 0 0; }
.report-centre-empty { min-height: 240px; }
.report-centre-empty > .material-symbols-outlined { color: var(--so-primary); font-size: 34px; }
.report-focused-preview { margin-top: 0; }
.report-focused-preview > header { align-items: center; }
.report-focused-preview > header > div:first-child > p:last-child { color: var(--so-text-muted); font-size: 12px; margin-top: 4px; }

.report-preview-controls {
    align-items: center;
    background: #f8faf9;
    border-bottom: 1px solid var(--so-border);
    display: flex;
    gap: 8px;
    padding: 10px 14px;
}

.report-preview-controls label { flex: 1; max-width: 420px; padding: 0 10px; }
.report-preview-controls .secondary-button { min-height: 40px; }

@keyframes so-spin { to { transform: rotate(360deg); } }

@media (max-width: 980px) {
    .report-centre-shell { grid-template-columns: 1fr; }
    .report-centre-library { max-height: none; position: static; }
    .report-category-list { display: flex; overflow-x: auto; }
    .report-category-button { flex: 0 0 auto; grid-template-columns: 20px auto auto; white-space: nowrap; }
    .report-library-list { display: flex; gap: 7px; max-height: none; overflow-x: auto; overflow-y: hidden; }
    .report-library-item { flex: 0 0 220px; }
}

@media (max-width: 620px) {
    .report-centre-library { margin-left: -12px; margin-right: -12px; }
    .report-viewer-toolbar { align-items: flex-start; flex-direction: column; }
    .report-toolbar-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
    .report-toolbar-actions .primary-button { grid-column: 2; }
    .report-toolbar-actions .secondary-button { grid-column: 1; grid-row: 1; }
    .report-format-select { grid-column: 1 / -1; grid-row: 2; }
    .report-format-select select { width: 100%; }
    .report-download-ready { grid-template-columns: 24px minmax(0, 1fr); }
    .report-download-ready .primary-button { grid-column: 1 / -1; }
    .report-focused-preview > header { align-items: flex-start; }
    .report-preview-controls label { max-width: none; }
    .report-error-state { grid-template-columns: 26px minmax(0, 1fr); }
    .report-error-state button { grid-column: 1 / -1; }
}

/* Phase 4: administration and master data */
.master-context-bar {
    align-items: center;
    background: #eef6f3;
    border: 1px solid #d3e5de;
    border-radius: 13px;
    display: flex;
    gap: 18px;
    justify-content: space-between;
    padding: 13px 16px;
}

.master-context-bar p { margin: 0 0 2px; }
.master-context-bar > div:first-child > strong { display: block; font-size: 15px; }
.master-context-bar > div:first-child > span { color: var(--so-text-muted); font-size: 12px; }
.master-context-metrics { display: flex; flex-wrap: wrap; gap: 7px; }
.master-context-metrics span { background: #fff; border: 1px solid var(--so-border); border-radius: 999px; color: var(--so-text-muted); font-size: 10px; padding: 6px 9px; }
.master-context-metrics strong { color: var(--so-text); font-size: 12px; margin-right: 2px; }

.master-section-tabs {
    border-bottom: 1px solid var(--so-border);
    display: flex;
    gap: 4px;
    margin: 0 0 18px;
    overflow-x: auto;
}

.master-section-tabs button {
    align-items: center;
    background: transparent;
    border: 0;
    border-bottom: 3px solid transparent;
    color: var(--so-text-muted);
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    gap: 6px;
    min-height: 44px;
    padding: 0 12px;
    white-space: nowrap;
}

.master-section-tabs button.selected { border-bottom-color: var(--so-primary); color: var(--so-primary); }
.master-section-tabs .material-symbols-outlined { font-size: 18px; }
.master-form-section { display: grid; gap: 12px; }
.master-section-heading { align-items: flex-start; background: #f7faf9; border: 1px solid var(--so-border); border-radius: 11px; display: flex; gap: 10px; margin-bottom: 2px; padding: 11px 13px; }
.master-section-heading > .material-symbols-outlined { color: var(--so-primary); }
.master-section-heading h3 { font-size: 14px; margin: 0; }
.master-section-heading p { color: var(--so-text-muted); font-size: 11px; margin: 2px 0 0; }

.master-filter-toolbar {
    align-items: end;
    background: #f7faf9;
    border: 1px solid var(--so-border);
    border-radius: 11px;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(250px, 1fr) minmax(140px, 190px) minmax(140px, 190px);
    margin-bottom: 13px;
    padding: 11px;
}

.master-filter-toolbar > label:not(.search-box) { color: var(--so-text-muted); display: grid; font-size: 10px; font-weight: 700; gap: 4px; letter-spacing: .03em; text-transform: uppercase; }
.master-filter-toolbar select { background: #fff; border: 1px solid var(--so-border-strong); border-radius: 9px; color: var(--so-text); min-height: 42px; padding: 0 10px; text-transform: none; }
.master-filter-toolbar .search-box { background: #fff; margin: 0; min-height: 42px; }
.master-pagination { align-items: center; border-top: 1px solid var(--so-border); color: var(--so-text-muted); display: flex; font-size: 11px; gap: 12px; justify-content: space-between; margin-top: 12px; padding-top: 12px; }
.master-pagination .secondary-button { min-height: 38px; }
.master-pagination .material-symbols-outlined { font-size: 17px; }
.master-empty-state { margin: 6px 0; min-height: 190px; }
.master-empty-state .material-symbols-outlined { color: var(--so-primary); font-size: 32px; }

@media (max-width: 800px) {
    .master-context-bar { align-items: flex-start; flex-direction: column; }
    .master-filter-toolbar { grid-template-columns: 1fr 1fr; }
    .master-filter-toolbar .search-box { grid-column: 1 / -1; }
}

@media (max-width: 520px) {
    .master-context-bar { margin-left: -12px; margin-right: -12px; border-left: 0; border-radius: 0; border-right: 0; }
    .master-context-metrics { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
    .master-filter-toolbar { grid-template-columns: 1fr; }
    .master-filter-toolbar .search-box { grid-column: auto; }
    .master-pagination { align-items: flex-start; flex-direction: column; }
    .master-pagination .two-actions { width: 100%; }
    .master-pagination .two-actions button { flex: 1; }
}

/* Phase 5: billing and collection */
.billing-command-summary {
    align-items: center;
    background: linear-gradient(120deg, #0c5947, #0a4538);
    border-radius: 14px;
    color: #fff;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    padding: 15px 18px;
}

.billing-command-summary .label { color: #a9d9c8; margin: 0 0 2px; }
.billing-command-summary > div:first-child strong { display: block; font-size: 16px; }
.billing-command-summary > div:first-child span { color: rgba(255,255,255,.72); font-size: 11px; }
.billing-summary-metrics { display: grid; gap: 8px; grid-template-columns: repeat(4, minmax(90px, 1fr)); }
.billing-summary-metrics span { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.14); border-radius: 9px; display: grid; gap: 2px; padding: 8px 10px; }
.billing-summary-metrics small { color: rgba(255,255,255,.65); font-size: 9px; text-transform: uppercase; }
.billing-summary-metrics strong { font-size: 13px; }

.billing-workflow-steps {
    display: grid;
    gap: 7px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 18px;
}

.billing-workflow-steps > div { border: 1px solid var(--so-border); border-radius: 10px; display: grid; gap: 2px; grid-template-columns: 28px minmax(0,1fr); padding: 9px; }
.billing-workflow-steps > div > span { align-items: center; background: #edf2f0; border-radius: 50%; color: var(--so-text-muted); display: flex; font-size: 11px; font-weight: 800; grid-row: 1 / 3; height: 25px; justify-content: center; width: 25px; }
.billing-workflow-steps strong { font-size: 11px; }
.billing-workflow-steps small { color: var(--so-text-muted); font-size: 9px; }
.billing-workflow-steps .complete { background: #f0f9f5; border-color: #c2e1d5; }
.billing-workflow-steps .complete > span { background: var(--so-primary); color: #fff; }
.billing-workflow-steps .current { border-color: #e4b84c; box-shadow: inset 0 0 0 1px #e4b84c; }
.billing-workflow-steps .current > span { background: #f5c85b; color: #523800; }

.billing-register-centre { min-width: 0; }
.billing-register-tabs { display: grid; gap: 8px; grid-template-columns: repeat(3,minmax(0,1fr)); margin-bottom: 13px; }
.billing-register-tabs button { align-items: center; background: #fff; border: 1px solid var(--so-border); border-radius: 11px; color: var(--so-text); cursor: pointer; display: grid; gap: 9px; grid-template-columns: 30px minmax(0,1fr); min-height: 64px; padding: 10px 12px; text-align: left; }
.billing-register-tabs button.selected { background: var(--so-primary-soft); border-color: #94c4b3; color: var(--so-primary); box-shadow: inset 3px 0 0 var(--so-primary); }
.billing-register-tabs .material-symbols-outlined { font-size: 23px; }
.billing-register-tabs strong,.billing-register-tabs small { display: block; }
.billing-register-tabs strong { font-size: 12px; }
.billing-register-tabs small { color: var(--so-text-muted); font-size: 10px; margin-top: 2px; }

.billing-register-toolbar { align-items: end; background: #f7faf9; border: 1px solid var(--so-border); border-radius: 11px; display: grid; gap: 10px; grid-template-columns: minmax(250px,1fr) minmax(140px,180px) auto; margin-bottom: 12px; padding: 11px; }
.billing-register-toolbar > label:not(.search-box) { color: var(--so-text-muted); display: grid; font-size: 9px; font-weight: 700; gap: 4px; text-transform: uppercase; }
.billing-register-toolbar select { background: #fff; border: 1px solid var(--so-border-strong); border-radius: 9px; min-height: 42px; padding: 0 10px; text-transform: none; }
.billing-register-toolbar .search-box { background: #fff; margin: 0; min-height: 42px; }
.billing-register-actions { display: flex; flex-wrap: wrap; gap: 7px; justify-content: flex-end; }
.billing-register-actions button { min-height: 42px; }
.billing-delivery-strip { align-items: center; background: #f2f7f5; border: 1px solid var(--so-border); border-radius: 10px; display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 12px; padding: 10px 12px; }
.billing-delivery-strip > div { display: grid; flex: 1; min-width: 190px; }
.billing-delivery-strip small { color: var(--so-text-muted); font-size: 10px; }
.billing-delivery-strip label { align-items: center; display: flex; font-size: 11px; gap: 5px; }

@media (max-width: 900px) {
    .billing-command-summary { align-items: flex-start; flex-direction: column; }
    .billing-summary-metrics { width: 100%; }
    .billing-workflow-steps { display: flex; overflow-x: auto; }
    .billing-workflow-steps > div { flex: 0 0 150px; }
    .billing-register-toolbar { grid-template-columns: 1fr 1fr; }
    .billing-register-toolbar .search-box { grid-column: 1 / -1; }
    .billing-register-actions { justify-content: flex-start; }
}

@media (max-width: 560px) {
    .billing-command-summary { margin-left: -12px; margin-right: -12px; border-radius: 0; }
    .billing-summary-metrics { grid-template-columns: 1fr 1fr; }
    .billing-register-tabs { display: flex; overflow-x: auto; }
    .billing-register-tabs button { flex: 0 0 170px; }
    .billing-register-toolbar { grid-template-columns: 1fr; }
    .billing-register-toolbar .search-box { grid-column: auto; }
    .billing-register-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .billing-delivery-strip { align-items: stretch; flex-direction: column; }
}

/* Phase 6: community operations and communication */
.operations-command-summary {
    align-items: center;
    background: #0b5141;
    border-radius: 14px;
    color: #fff;
    display: flex;
    gap: 18px;
    justify-content: space-between;
    padding: 15px 18px;
}

.operations-command-summary .label { color: #a8d7c7; margin: 0 0 2px; }
.operations-command-summary > div:first-child strong { display: block; font-size: 16px; }
.operations-command-summary > div:first-child span { color: rgba(255,255,255,.7); font-size: 11px; }
.operations-command-summary > div:last-child { display: grid; gap: 8px; grid-template-columns: repeat(4,minmax(90px,1fr)); }
.operations-command-summary > div:last-child > span { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.14); border-radius: 9px; display: grid; gap: 2px; padding: 8px 10px; }
.operations-command-summary small { color: rgba(255,255,255,.63); font-size: 9px; text-transform: uppercase; }
.operations-command-summary > div:last-child strong { font-size: 13px; }

.operations-filter-toolbar {
    align-items: end;
    background: #f7faf9;
    border: 1px solid var(--so-border);
    border-radius: 11px;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(250px,1fr) minmax(140px,190px) minmax(140px,190px);
    padding: 11px;
}

.complaint-filter-toolbar { grid-template-columns: minmax(240px,1fr) repeat(3,minmax(120px,165px)); }
.operations-filter-toolbar > label:not(.search-box) { color: var(--so-text-muted); display: grid; font-size: 9px; font-weight: 700; gap: 4px; letter-spacing: .03em; text-transform: uppercase; }
.operations-filter-toolbar select { background: #fff; border: 1px solid var(--so-border-strong); border-radius: 9px; min-height: 42px; padding: 0 10px; text-transform: none; }
.operations-filter-toolbar .search-box { background: #fff; margin: 0; min-height: 42px; }
.operations-empty-state { min-height: 210px; }
.operations-empty-state > .material-symbols-outlined { color: var(--so-primary); font-size: 33px; }
.professional-notice-grid .card { display: flex; flex-direction: column; }
.professional-notice-grid .notice-actions { margin-top: auto; padding-top: 12px; }
.document-command-summary { background: linear-gradient(120deg,#123f50,#0b5141); }
.document-filter-toolbar { margin-bottom: 2px; }

@media (max-width: 900px) {
    .operations-command-summary { align-items: flex-start; flex-direction: column; }
    .operations-command-summary > div:last-child { width: 100%; }
    .complaint-filter-toolbar { grid-template-columns: 1fr 1fr; }
    .complaint-filter-toolbar .search-box { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
    .operations-command-summary { margin-left: -12px; margin-right: -12px; border-radius: 0; }
    .operations-command-summary > div:last-child { grid-template-columns: 1fr 1fr; }
    .operations-filter-toolbar,
    .complaint-filter-toolbar { grid-template-columns: 1fr; }
    .operations-filter-toolbar .search-box,
    .complaint-filter-toolbar .search-box { grid-column: auto; }
    .professional-notice-grid { grid-template-columns: 1fr; }
}

/* Phases 9-13: vendors, governance, redevelopment, parking and access security */
.vendor-command-summary { background: linear-gradient(120deg, #173f55, #0b5849); }
.governance-command-summary { background: linear-gradient(120deg, #213f62, #145848); }
.parking-command-summary { background: linear-gradient(120deg, #234d42, #146356); }
.redevelopment-command-summary { background: linear-gradient(120deg, #553d24, #775827); }
.access-command-summary { background: linear-gradient(120deg, #273d57, #164d54); }
.vendor-filter-toolbar,
.parking-filter-toolbar { grid-template-columns: minmax(260px,1fr) minmax(150px,200px); margin: 12px 0; }
.parking-dispute-filter { grid-template-columns: minmax(150px,200px); margin-bottom: 12px; }
.meeting-filter-toolbar { grid-template-columns: minmax(260px,1fr) minmax(170px,220px); margin-bottom: 14px; }
.meeting-grid .meeting-card { border-top: 3px solid #c4ded5; }
.meeting-card .two-actions { align-items: stretch; }
.meeting-card .two-actions button { min-height: 39px; }
.redevelopment-command-summary > div:last-child { grid-template-columns: repeat(4,minmax(105px,1fr)); }
.redevelopment-command-summary > div:last-child strong { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.access-command-summary + .module-workspace-nav,
.parking-command-summary + .module-workspace-nav,
.governance-command-summary + .module-workspace-nav { margin-top: 0; }

@media (max-width: 760px) {
    .meeting-grid { grid-template-columns: 1fr; }
    .redevelopment-command-summary > div:last-child { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 600px) {
    .vendor-command-summary,
    .governance-command-summary,
    .parking-command-summary,
    .redevelopment-command-summary,
    .access-command-summary { border-radius: 0; margin-left: -12px; margin-right: -12px; }
    .vendor-filter-toolbar,
    .parking-filter-toolbar,
    .parking-dispute-filter,
    .meeting-filter-toolbar { grid-template-columns: 1fr; }
    .vendor-filter-toolbar .search-box,
    .parking-filter-toolbar .search-box,
    .meeting-filter-toolbar .search-box { grid-column: auto; }
    .meeting-card .two-actions { display: grid; grid-template-columns: 1fr 1fr; }
}

@media print {
    .topbar,
    .bottom-nav,
    .module-workspace-nav,
    .app-status-banner,
    .report-actions,
    .two-actions { display: none !important; }
}

/* Phase 8: facilities and booking management */
.facility-command-summary { background: linear-gradient(120deg, #154a57, #0b624d); }
.facility-agenda,
.facility-master-workspace,
.facility-booking-workspace { display: grid; gap: 14px; }
.facility-agenda .section-title,
.facility-booking-workspace .section-title,
.facility-master-workspace .section-title { align-items: center; margin-bottom: 0; }
.facility-agenda .section-title p,
.facility-booking-workspace .section-title p,
.facility-master-workspace .section-title p { margin: 3px 0 0; }
.facility-agenda-list { display: grid; gap: 9px; }
.facility-agenda-card {
    align-items: center;
    display: grid;
    gap: 13px;
    grid-template-columns: 54px minmax(0,1fr) auto;
    padding: 12px 14px;
}
.facility-date-tile {
    align-items: center;
    background: var(--so-primary-soft);
    border: 1px solid #c8e1d8;
    border-radius: 10px;
    color: var(--so-primary);
    display: flex;
    flex-direction: column;
    height: 52px;
    justify-content: center;
    width: 52px;
}
.facility-date-tile strong { font-size: 19px; line-height: 1; }
.facility-date-tile span { font-size: 9px; font-weight: 800; margin-top: 3px; text-transform: uppercase; }
.facility-agenda-card p,
.facility-booking-card p { color: var(--so-text-muted); font-size: 11px; margin: 3px 0; }
.facility-agenda-card small,
.facility-booking-card small { color: var(--so-text-muted); font-size: 10px; }
.facility-agenda-meta { align-items: flex-end; display: grid; gap: 7px; justify-items: end; }
.facility-master-toolbar { grid-template-columns: minmax(260px,1fr) minmax(150px,190px); margin-bottom: 12px; }
.facility-booking-toolbar { margin-bottom: 13px; }
.facility-booking-list { display: grid; gap: 9px; }
.facility-booking-card {
    align-items: center;
    background: #fff;
    border: 1px solid var(--so-border);
    border-radius: 12px;
    display: grid;
    gap: 12px;
    grid-template-columns: 54px minmax(190px,1fr) minmax(90px,auto) auto auto;
    padding: 12px 14px;
}
.facility-booking-main { min-width: 0; }
.facility-booking-charge { display: grid; gap: 2px; }
.facility-booking-charge strong { font-size: 13px; }
.facility-booking-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.facility-booking-actions button { min-height: 36px; padding: 0 10px; }
.facility-booking-actions .material-symbols-outlined { font-size: 17px; }

@media (max-width: 900px) {
    .facility-booking-card { grid-template-columns: 54px minmax(0,1fr) auto; }
    .facility-booking-charge { justify-items: end; }
    .facility-booking-card > .badge { grid-column: 2; justify-self: start; }
    .facility-booking-actions { grid-column: 3; grid-row: 2; }
}

@media (max-width: 600px) {
    .facility-command-summary { border-radius: 0; margin-left: -12px; margin-right: -12px; }
    .facility-agenda .section-title,
    .facility-booking-workspace .section-title,
    .facility-master-workspace .section-title { align-items: flex-start; flex-direction: column; }
    .facility-agenda .section-title button,
    .facility-booking-workspace .section-title button,
    .facility-master-workspace .section-title button { width: 100%; }
    .facility-master-toolbar,
    .facility-booking-toolbar { grid-template-columns: 1fr; }
    .facility-master-toolbar .search-box,
    .facility-booking-toolbar .search-box { grid-column: auto; }
    .facility-agenda-card { align-items: start; grid-template-columns: 48px minmax(0,1fr); }
    .facility-agenda-meta { align-items: center; display: flex; grid-column: 2; justify-content: space-between; }
    .facility-date-tile { height: 46px; width: 46px; }
    .facility-booking-card { align-items: start; grid-template-columns: 48px minmax(0,1fr); }
    .facility-booking-charge { grid-column: 2; justify-items: start; }
    .facility-booking-card > .badge { grid-column: 2; }
    .facility-booking-actions { display: grid; grid-column: 1 / -1; grid-row: auto; grid-template-columns: 1fr 1fr; justify-content: stretch; }
    .facility-booking-actions button:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
