/* New York City Council design tokens, modeled on council.nyc.gov (palette from the site's theme CSS, layout from its header
   and footer; see docs/brand/README.md). The Council seal is used with the sponsor's approval of 2026-10-08.
   Typography: Open Sans for text (the site's own fallback); Montserrat, the closest free match to the site's licensed Gotham,
   for headings and labels; Georgia for the "New York City Council" wordmark, as on the site.
   Contrast verified with the WCAG relative-luminance formula on 2026-10-08 (docs/06-UX-and-Accessibility-Standards.md, section 2):
   blue #2f56a6 on white 6.99:1 (white on blue 6.99:1, the serif wordmark); dark blue #23417d with white 9.89:1;
   footer blue #22427e with white 9.77:1, gold #ffae00 focus ring on footer blue 5.26:1; nav gray #414042 on white 10.31:1;
   red #cb4a3a with white 4.59:1 (bold button text and accents only); error ink #a8382a on white 6.43:1, on #fbecea 5.60:1;
   gold #ffae00 on dark blue 5.32:1, #222 on gold 8.57:1; ink #222 on white 15.91:1, on #e6e6e6 12.75:1;
   gray #666 on white 5.74:1, on #f4f6fa 5.31:1; border gray #767676 on white 4.54:1; focus #0b5cd5 on white 5.99:1;
   success #1e6b3a on #e6f4ea 5.74:1; warning #8a5a00 on #fff4dc 5.43:1; info #23417d on #e8eef9 8.49:1.
   Status colors (StatusPalette.cs, shared by badges and charts), white text on each and each 3:1 or better against white:
   Accepted #1e6b3a 6.52:1; Submitted or resubmitted #2f56a6 6.99:1; Flagged #cb4a3a 4.59:1 (badges are bold);
   Updates requested #8a5a00 5.93:1; Draft #23417d 9.89:1; Not started #767676 4.54:1.
   Never: gold text or icons on white (1.86:1), red on dark blue (2.16:1), #cacaca for text or control borders (1.64:1). */

@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("lib/open-sans/open-sans-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("lib/open-sans/open-sans-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("lib/open-sans/open-sans-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 600; font-display: swap; src: url("lib/montserrat/montserrat-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 700; font-display: swap; src: url("lib/montserrat/montserrat-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 800; font-display: swap; src: url("lib/montserrat/montserrat-latin-800-normal.woff2") format("woff2"); }

:root {
    --nyc-blue: #2f56a6;
    --nyc-blue-dark: #23417d;
    --nyc-footer: #22427e;
    --nyc-nav-ink: #414042;
    --nyc-rule: #58595b;
    --nyc-red: #cb4a3a;
    --nyc-error: #a8382a;
    --nyc-gold: #ffae00;
    --nyc-ink: #222222;
    --nyc-gray: #666666;
    --nyc-gray-border: #767676;
    --nyc-gray-line: #cacaca;
    --nyc-gray-surface: #e6e6e6;
    --nyc-surface: #f4f6fa;
    --nyc-white: #ffffff;
    --nyc-focus: #0b5cd5;
    --nyc-ok-bg: #e6f4ea;
    --nyc-ok-ink: #1e6b3a;
    --nyc-warn-bg: #fff4dc;
    --nyc-warn-ink: #8a5a00;
    --nyc-info-bg: #e8eef9;
    --nyc-info-ink: #23417d;
    --nyc-error-bg: #fbecea;
    --nyc-font-heading: "Montserrat", "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --nyc-font-wordmark: Georgia, Cambria, "Times New Roman", Times, serif;

    --bs-primary: var(--nyc-blue);
    --bs-primary-rgb: 47, 86, 166;
    --bs-link-color: var(--nyc-blue);
    --bs-link-color-rgb: 47, 86, 166;
    --bs-link-hover-color: var(--nyc-blue-dark);
    --bs-link-hover-color-rgb: 35, 65, 125;
    --bs-body-color: var(--nyc-ink);
    --bs-body-font-family: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --bs-body-font-size: 1rem;
    --bs-secondary-color: var(--nyc-gray);
    --bs-border-color: var(--nyc-gray-line);
}

html, body { background: var(--nyc-surface); }
body { display: flex; flex-direction: column; min-height: 100vh; font-family: var(--bs-body-font-family); }

/* Focus is always visible (WCAG 2.4.7, 1.4.11). */
:focus-visible, .btn:focus-visible, .form-control:focus, .form-select:focus, .form-check-input:focus {
    outline: 3px solid var(--nyc-focus) !important;
    outline-offset: 2px;
    box-shadow: none !important;
}
.nyc-footer :focus-visible { outline-color: var(--nyc-gold) !important; }

/* Form control borders at least 3:1 against white (WCAG 1.4.11). */
.form-control, .form-select, .form-check-input { border-color: var(--nyc-gray-border); }
.form-check-input:checked { background-color: var(--nyc-blue); border-color: var(--nyc-blue); }
.form-control[readonly] { background-color: var(--nyc-surface); }

.skip-link { position: absolute; left: 1rem; top: -4rem; z-index: 1000; background: var(--nyc-white); color: var(--nyc-blue-dark); padding: .75rem 1rem; border-radius: .375rem; font-weight: 600; }
.skip-link:focus { top: .75rem; }

/* Buttons */
.btn { --bs-btn-border-radius: .2rem; font-weight: 600; }
.btn-primary { --bs-btn-bg: var(--nyc-blue); --bs-btn-border-color: var(--nyc-blue); --bs-btn-hover-bg: var(--nyc-blue-dark); --bs-btn-hover-border-color: var(--nyc-blue-dark); --bs-btn-active-bg: var(--nyc-blue-dark); --bs-btn-disabled-bg: var(--nyc-blue); --bs-btn-disabled-border-color: var(--nyc-blue); }
.btn-outline-primary { --bs-btn-color: var(--nyc-blue); --bs-btn-border-color: var(--nyc-blue); --bs-btn-hover-bg: var(--nyc-blue); --bs-btn-hover-border-color: var(--nyc-blue); --bs-btn-active-bg: var(--nyc-blue-dark); }
.btn-outline-secondary { --bs-btn-color: #444444; --bs-btn-border-color: var(--nyc-gray-border); }
.btn-danger { --bs-btn-bg: var(--nyc-red); --bs-btn-border-color: var(--nyc-red); --bs-btn-hover-bg: var(--nyc-error); --bs-btn-hover-border-color: var(--nyc-error); font-weight: 700; }
.btn-outline-danger { --bs-btn-color: var(--nyc-error); --bs-btn-border-color: var(--nyc-error); --bs-btn-hover-bg: var(--nyc-error); --bs-btn-hover-border-color: var(--nyc-error); }

/* Environment banner for the POC, UAT and training environments */
.nyc-env { background: var(--nyc-ink); color: var(--nyc-white); font-size: .85rem; padding: .3rem 1.5rem; display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
.nyc-env strong { background: var(--nyc-gold); color: var(--nyc-ink); padding: 0 .4rem; border-radius: .2rem; }

/* Header: white, seal and serif wordmark, gray rule, as on council.nyc.gov */
.nyc-header { background: var(--nyc-white); color: var(--nyc-ink); border-bottom: 1px solid var(--nyc-rule); box-shadow: 0 2px 0 var(--nyc-gray-surface); }
.nyc-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .6rem 1.5rem; flex-wrap: wrap; }
.nyc-brand { display: flex; align-items: center; gap: .7rem; color: var(--nyc-blue); text-decoration: none; flex-wrap: wrap; }
.nyc-brand:hover { color: var(--nyc-blue-dark); }
.nyc-brand-seal { width: 52px; height: 56px; flex: 0 0 auto; }
.nyc-brand-text { display: flex; flex-direction: column; line-height: 1.1; }
.nyc-brand-council { font-family: var(--nyc-font-wordmark); font-size: 1.65rem; font-weight: 400; color: var(--nyc-blue); }
.nyc-brand-division { font-family: var(--nyc-font-heading); font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .16em; color: var(--nyc-nav-ink); margin-top: .3rem; }
.nyc-brand-app { font-family: var(--nyc-font-heading); font-size: 1.05rem; font-weight: 700; color: var(--nyc-ink); border-left: 1px solid var(--nyc-rule); padding-left: .9rem; margin-left: .3rem; align-self: stretch; display: flex; align-items: center; }
.nyc-header-tools { display: flex; align-items: center; gap: .75rem; }
.nyc-header-link { color: var(--nyc-nav-ink); text-decoration: none; font-family: var(--nyc-font-heading); font-weight: 700; font-size: .78rem; text-transform: uppercase; letter-spacing: .12em; padding: .45rem .5rem; border-radius: .2rem; }
.nyc-header-link:hover { color: var(--nyc-blue); background: var(--nyc-surface); }

.nyc-persona { position: relative; z-index: 45; }
.nyc-persona-backdrop { position: fixed; inset: 0; z-index: 40; background: transparent; }
.nyc-persona-button { display: grid; grid-template-columns: auto auto; column-gap: .5rem; align-items: center; text-align: left; background: var(--nyc-white); color: var(--nyc-ink); border: 1px solid var(--nyc-gray-border); border-radius: .2rem; padding: .35rem .75rem; }
.nyc-persona-button:hover { background: var(--nyc-surface); }
.nyc-persona-name { font-weight: 700; }
.nyc-persona-meta { grid-column: 1; font-size: .8rem; }
.nyc-persona-button .bi { grid-row: 1 / span 2; grid-column: 2; }
.nyc-persona-panel { position: absolute; right: 0; top: calc(100% + .5rem); z-index: 50; width: 24rem; max-width: calc(100vw - 2rem); max-height: 75vh; overflow-y: auto; background: var(--nyc-white); color: var(--nyc-ink); border-radius: .5rem; box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.25); padding: .75rem; }
.nyc-persona-caption { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: var(--nyc-gray); margin: .5rem 0 .25rem; }
.nyc-persona-panel ul, .nyc-signin-list { list-style: none; margin: 0; padding: 0; }
.nyc-persona-panel a, .nyc-signin-option { display: flex; gap: .75rem; align-items: flex-start; padding: .5rem; border-radius: .375rem; color: var(--nyc-ink); text-decoration: none; }
.nyc-persona-panel a:hover, .nyc-signin-option:hover { background: var(--nyc-surface); }
.nyc-persona-panel a.is-current { background: var(--nyc-info-bg); }
.nyc-role-chip { flex: 0 0 auto; display: inline-block; min-width: 6.5rem; text-align: center; font-size: .75rem; font-weight: 700; padding: .2rem .45rem; border-radius: 999px; }
.role-FinanceAdministrator { background: var(--nyc-blue-dark); color: var(--nyc-white); }
.role-FinanceReviewer { background: var(--nyc-info-bg); color: var(--nyc-info-ink); }
.role-FinanceViewer { background: var(--nyc-gray-surface); color: var(--nyc-ink); }
.role-Submitter { background: var(--nyc-ok-bg); color: var(--nyc-ok-ink); }

/* Shell */
.nyc-shell { flex: 1; display: grid; grid-template-columns: 15.5rem 1fr; }
.nyc-nav { background: var(--nyc-white); border-right: 1px solid var(--nyc-gray-line); padding: 1rem .75rem; }
.nyc-nav-list { list-style: none; margin: 0; padding: 0; }
.nyc-nav-list a { display: flex; gap: .6rem; align-items: center; padding: .5rem .75rem; margin-bottom: .1rem; border-radius: .375rem; color: var(--nyc-ink); text-decoration: none; border-left: 4px solid transparent; }
.nyc-nav-list a:hover { background: var(--nyc-surface); }
.nyc-nav-list a { border-radius: 0 .2rem .2rem 0; }
.nyc-nav-list a.active { background: var(--nyc-info-bg); color: var(--nyc-blue-dark); font-weight: 700; border-left-color: var(--nyc-red); }
.nyc-nav-heading { font-family: var(--nyc-font-heading); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .14em; color: var(--nyc-nav-ink); margin: 1.2rem .75rem .35rem; }
.nyc-main { padding: 1.5rem 2rem 3rem; min-width: 0; }
.nyc-main:focus { outline: none; }
/* Footer: council.nyc.gov style, dark blue band with white text and uppercase titles */
.nyc-footer { background: var(--nyc-footer); color: var(--nyc-white); font-size: .88rem; padding: 2rem 1.5rem 1.25rem; }
.nyc-footer-inner { display: grid; grid-template-columns: minmax(14rem, 1.2fr) minmax(14rem, 2fr) minmax(10rem, 1fr); gap: 1.5rem 2.5rem; }
.nyc-footer p { margin: 0 0 .5rem; }
.nyc-footer a { color: var(--nyc-white); text-decoration: underline; }
.nyc-footer a:hover { color: var(--nyc-white); text-decoration-thickness: 2px; }
.nyc-footer ul { list-style: none; margin: 0; padding: 0; }
.nyc-footer li { margin-bottom: .45rem; }
.nyc-footer-brand { display: flex; gap: .75rem; align-items: center; }
.nyc-footer-brand img { width: 45px; height: 48px; flex: 0 0 auto; }
.nyc-footer-brand p { margin: 0; }
.nyc-footer-council { font-family: var(--nyc-font-wordmark); font-size: 1.3rem; line-height: 1.1; }
.nyc-footer-division { font-family: var(--nyc-font-heading); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .16em; margin-top: .3rem !important; }
.nyc-footer-title { font-family: var(--nyc-font-heading); font-size: .9rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--nyc-white); margin-bottom: .6rem; }
.nyc-footer-note { font-family: var(--nyc-font-heading); font-size: .75rem; font-weight: 700; border-top: 1px solid rgba(255,255,255,.35); margin: 1.5rem 0 0 !important; padding-top: 1rem; }

@media (max-width: 900px) {
    .nyc-shell { grid-template-columns: 1fr; }
    .nyc-nav { border-right: none; border-bottom: 1px solid var(--nyc-gray-line); }
    .nyc-nav-list { display: flex; flex-wrap: wrap; gap: .25rem; }
    .nyc-nav-heading { display: none; }
    .nyc-main { padding: 1rem; }
    .nyc-footer-inner { grid-template-columns: 1fr; }
}

/* Headings and pages */
.nyc-page-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
h1, h2, h3, .h5 { font-family: var(--nyc-font-heading); }
h1 { font-size: 1.7rem; font-weight: 700; color: var(--nyc-ink); margin-bottom: .25rem; }
h1:focus, h1:focus-visible, [tabindex="-1"]:focus-visible { outline: none !important; }
h2 { font-size: 1.2rem; font-weight: 700; color: var(--nyc-blue-dark); }
h3 { font-size: 1.05rem; font-weight: 700; }
.nyc-subtitle { color: var(--nyc-gray); margin: 0; }

.nyc-card { background: var(--nyc-white); border: 1px solid var(--nyc-gray-line); border-radius: .5rem; padding: 1.25rem; }
.nyc-card + .nyc-card { margin-top: 1rem; }
.nyc-card-accent { border-top: 4px solid var(--nyc-blue); }

/* KPI tiles */
.nyc-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr)); gap: .9rem; margin: 0 0 1.5rem; padding: 0; list-style: none; }
.nyc-kpis > li { display: flex; }
.nyc-kpis > li > .nyc-kpi { flex: 1; }
.nyc-kpi { display: flex; flex-direction: column; background: var(--nyc-white); border: 1px solid var(--nyc-gray-line); border-top: 4px solid var(--nyc-blue); border-radius: .5rem; padding: .85rem 1rem; color: var(--nyc-ink); text-decoration: none; }
a.nyc-kpi:hover { box-shadow: 0 .25rem .75rem rgba(35,65,125,.15); color: var(--nyc-ink); }
.nyc-kpi.is-danger { border-top-color: var(--nyc-red); }
.nyc-kpi.is-warning { border-top-color: var(--nyc-gold); }
.nyc-kpi.is-ok { border-top-color: var(--nyc-ok-ink); }
.nyc-kpi-value { font-family: var(--nyc-font-heading); font-size: 2rem; font-weight: 700; line-height: 1.1; color: var(--nyc-blue-dark); }
.nyc-kpi.is-danger .nyc-kpi-value { color: var(--nyc-error); }
.nyc-kpi-label { font-weight: 700; }
.nyc-kpi-desc { color: var(--nyc-gray); font-size: .82rem; }
/* Home page "What you can do here" cards reuse the KPI card with room for a sentence. */
.nyc-home-cards { grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); }
.nyc-home-cards .nyc-kpi-label { color: var(--nyc-blue-dark); }
.nyc-home-cards .nyc-kpi-desc { font-size: .88rem; margin-top: .25rem; }

/* Tables */
.nyc-table-wrap { background: var(--nyc-white); border: 1px solid var(--nyc-gray-line); border-radius: .5rem; overflow-x: auto; }
.nyc-table { margin: 0; }
.nyc-table caption { caption-side: top; padding: .75rem 1rem; font-weight: 700; color: var(--nyc-blue-dark); }
.nyc-table thead th { background: var(--nyc-gray-surface); font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; color: var(--nyc-ink); white-space: nowrap; }
.nyc-table td, .nyc-table th { padding: .55rem .8rem; vertical-align: top; }
.nyc-table td.num, .nyc-table th.num { text-align: right; white-space: nowrap; }
.nyc-table tfoot td, .nyc-table tfoot th { font-weight: 700; background: var(--nyc-surface); }

/* Badges: never color alone (icon + text). */
.nyc-badge { display: inline-flex; align-items: center; gap: .3rem; font-size: .82rem; font-weight: 700; padding: .15rem .55rem; border-radius: 999px; white-space: nowrap; }
.badge-neutral { background: var(--nyc-gray-surface); color: var(--nyc-ink); }
.badge-info { background: var(--nyc-info-bg); color: var(--nyc-info-ink); }
.badge-warning { background: var(--nyc-warn-bg); color: var(--nyc-warn-ink); }
.badge-ok { background: var(--nyc-ok-bg); color: var(--nyc-ok-ink); }
.badge-danger { background: var(--nyc-error-bg); color: var(--nyc-error); }
.badge-gold { background: var(--nyc-gold); color: var(--nyc-ink); }
/* Submission status: fill from StatusPalette.cs (inline style), the same colors as the status charts. */
.nyc-status { color: var(--nyc-white); }

/* Filters */
.nyc-filters { background: var(--nyc-white); border: 1px solid var(--nyc-gray-line); border-radius: .5rem; padding: 1rem 1.25rem; margin-bottom: 1.25rem; }
.form-label { font-weight: 600; }
.nyc-req { font-weight: 400; color: var(--nyc-gray); font-size: .85rem; }

/* Empty state */
.nyc-empty { text-align: center; background: var(--nyc-white); border: 1px dashed var(--nyc-gray-border); border-radius: .5rem; padding: 2rem 1rem; color: var(--nyc-gray); }
.nyc-empty .bi { font-size: 2rem; }

/* Report form */
.nyc-form-section { background: var(--nyc-white); border: 1px solid var(--nyc-gray-line); border-radius: .5rem; padding: 1.25rem; margin-bottom: 1rem; }
.nyc-form-section > h2 { font-size: 1.15rem; margin-bottom: .5rem; }
.nyc-section-tag { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: .1rem .4rem; border-radius: .25rem; vertical-align: middle; margin-left: .4rem; }
.tag-standard { background: var(--nyc-info-bg); color: var(--nyc-info-ink); }
.tag-initiative { background: var(--nyc-warn-bg); color: var(--nyc-warn-ink); }
.nyc-question { padding: .75rem 0; border-top: 1px solid var(--nyc-gray-surface); }
.nyc-question:first-of-type { border-top: none; }
.nyc-question.is-branch { border-left: 4px solid var(--nyc-gold); padding-left: .85rem; background: #fffbf0; }
/* Question keys on the tinted branch background keep 4.5:1 (the default code pink measures 4.35:1 there). */
.nyc-question code { color: var(--nyc-blue-dark); }
.nyc-help { color: var(--nyc-gray); font-size: .88rem; margin-top: .2rem; }
.nyc-autofilled { font-size: .8rem; color: var(--nyc-ok-ink); font-weight: 600; }
.nyc-error-summary { border: 3px solid var(--nyc-error); border-radius: .5rem; padding: 1rem 1.25rem; background: var(--nyc-white); margin-bottom: 1rem; }
.nyc-error-summary h2 { color: var(--nyc-error); }
.nyc-field-error { color: var(--nyc-error); font-weight: 600; font-size: .9rem; margin-top: .25rem; }
.is-invalid { border-color: var(--nyc-error) !important; }
.nyc-callout { background: var(--nyc-info-bg); color: var(--nyc-info-ink); padding: .65rem .85rem; border-radius: .375rem; }
.nyc-callout.is-warning { background: var(--nyc-warn-bg); color: var(--nyc-warn-ink); }
.nyc-callout.is-danger { background: var(--nyc-error-bg); color: var(--nyc-error); }
.nyc-callout.is-ok { background: var(--nyc-ok-bg); color: var(--nyc-ok-ink); }

/* Sticky save bar with the autosave status */
.nyc-savebar { position: sticky; bottom: 0; z-index: 20; display: flex; gap: .75rem; align-items: center; justify-content: space-between; flex-wrap: wrap; background: var(--nyc-white); border: 1px solid var(--nyc-gray-line); border-top: 4px solid var(--nyc-blue); border-radius: .5rem; padding: .75rem 1rem; box-shadow: 0 -.25rem .75rem rgba(0,0,0,.08); }
.nyc-savestate { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; }
.nyc-savestate.is-saved { color: var(--nyc-ok-ink); }
.nyc-savestate.is-saving { color: var(--nyc-gray); }
.nyc-savestate.is-error { color: var(--nyc-error); }
/* Save confirmation (docs/06, section 3, Feedback): the layout toast in the success pair (#1e6b3a on #e6f4ea, 5.74:1) with a
   check icon; fixed at the bottom right, above the report save bar, and never in the way of a click. */
.nyc-toast-region { position: fixed; right: 1rem; bottom: 1.25rem; z-index: 1050; max-width: min(26rem, calc(100vw - 2rem)); pointer-events: none; }
body:has(.nyc-savebar) .nyc-toast-region { bottom: 6.5rem; }
.nyc-toast { display: flex; gap: .5rem; align-items: flex-start; background: var(--nyc-ok-bg); color: var(--nyc-ok-ink); border: 1px solid var(--nyc-ok-ink); border-left-width: 6px; border-radius: .375rem; padding: .75rem 1rem; font-weight: 600; box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.18); animation: nyc-toast-in .2s ease-out; }
.nyc-toast .bi { margin-top: .1rem; }
@keyframes nyc-toast-in { from { opacity: 0; transform: translateY(.5rem); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .nyc-toast { animation: none; } }
.btn.is-saving { cursor: progress; opacity: .85; }
.btn.is-saving .spinner-border { margin-right: .35rem; vertical-align: -.125em; }
.nyc-savestate.is-saved .bi { color: var(--nyc-ok-ink); }

/* Spreadsheet-style grid */
.nyc-grid { min-width: 40rem; }
.nyc-grid th { background: var(--nyc-gray-surface); font-size: .82rem; }
.nyc-grid td { padding: .25rem; }
.nyc-grid td .form-control, .nyc-grid td .form-select { border-radius: .2rem; padding: .3rem .45rem; font-size: .92rem; }
.nyc-grid .num input { text-align: right; }
.nyc-grid tfoot td { font-weight: 700; background: var(--nyc-surface); padding: .45rem .5rem; }
.nyc-grid .rownum { width: 2.5rem; text-align: center; color: var(--nyc-gray); font-size: .85rem; }
.nyc-sumrule { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-top: .5rem; }

/* Spreadsheet paste and upload into a table, and year-over-year variance beside an answer */
.nyc-import { background: var(--nyc-white); }
.nyc-mono { font-family: Consolas, "Courier New", monospace; font-size: .88rem; }
.nyc-row-error th, .nyc-row-error td { background: var(--nyc-error-bg); }
.nyc-cell-issues { list-style: none; margin: 0; padding: 0; color: var(--nyc-error); font-size: .85rem; font-weight: 600; }
.nyc-variance { margin-top: .4rem; padding: .4rem .6rem; border-left: 4px solid var(--nyc-warn-ink); background: var(--nyc-surface); font-size: .9rem; }
.nyc-kpi-money { font-size: 1.5rem; }

/* Definition lists */
.nyc-dl { display: grid; grid-template-columns: 12rem 1fr; gap: .4rem 1rem; margin: 0; }
.nyc-dl dt { color: var(--nyc-gray); font-weight: 600; }
.nyc-dl dd { margin: 0; }
@media (max-width: 600px) { .nyc-dl { grid-template-columns: 1fr; } .nyc-dl dd { margin-bottom: .5rem; } }

/* History */
.nyc-history { list-style: none; margin: 0; padding: 0; max-height: 32rem; overflow-y: auto; }
.nyc-history li { border-left: 3px solid var(--nyc-gray-line); padding: .25rem 0 .75rem .85rem; position: relative; }
.nyc-history li::before { content: ""; position: absolute; left: -7px; top: .55rem; width: 11px; height: 11px; border-radius: 50%; background: var(--nyc-blue); }
.nyc-history li.is-denied::before { background: var(--nyc-red); }
.nyc-history time { font-size: .8rem; color: var(--nyc-gray); }
.nyc-history del { color: var(--nyc-error); }
.nyc-history ins { color: var(--nyc-ok-ink); text-decoration: none; font-weight: 700; }

/* Documents */
.nyc-doclist { list-style: none; margin: 0 0 .75rem; padding: 0; }
.nyc-doclist li { display: flex; gap: .6rem; align-items: center; padding: .4rem 0; border-bottom: 1px solid var(--nyc-gray-surface); }
.nyc-doclist .bi { font-size: 1.3rem; color: var(--nyc-blue); }

/* Charts: each chart sits beside its data table (WCAG 1.1.1). */
.nyc-chart { position: relative; height: 22rem; }
.nyc-chart.is-tall { height: 34rem; }
/* District map panel (Charts and graphs, public funding view) */
.nyc-map-panel { background: var(--nyc-surface); border: 1px solid var(--nyc-gray-line); border-radius: .5rem; padding: 1rem; }
.nyc-map-panel:focus { outline: none; }
.nyc-map-panel table { overflow-wrap: normal; }
.nyc-map-facts { display: grid; grid-template-columns: auto 1fr; gap: .15rem 1rem; margin-bottom: .75rem; }
.nyc-map-facts dt { font-weight: 600; }
.nyc-map-facts dd { margin: 0; }
/* Public layout: no left menu, so the content is centered at a readable width. */
.nyc-public-main { flex: 1; width: 100%; max-width: 90rem; margin: 0 auto; }

/* Sign-in */
.nyc-signin { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding: 2rem 1rem; background: var(--nyc-footer); }
.nyc-signin-brand { display: flex; align-items: center; gap: 1rem; color: var(--nyc-white); max-width: 46rem; width: 100%; margin-bottom: 1.25rem; }
.nyc-signin-brand img { width: 84px; height: 90px; flex: 0 0 auto; }
.nyc-signin-brand p { margin: 0; }
.nyc-signin-council { font-family: var(--nyc-font-wordmark); font-size: 2.1rem; line-height: 1.1; }
.nyc-signin-division { font-family: var(--nyc-font-heading); font-size: .85rem; font-weight: 700; text-transform: uppercase; letter-spacing: .18em; margin-top: .4rem !important; }
.nyc-signin-card { background: var(--nyc-white); border-radius: .3rem; padding: 2rem; max-width: 46rem; width: 100%; border-top: 6px solid var(--nyc-gold); }
.nyc-signin-list li { border-bottom: 1px solid var(--nyc-gray-surface); }

/* Feedback widget (UAT and training) */
.nyc-feedback { position: absolute; right: 1rem; top: 0; z-index: 60; display: flex; flex-direction: column-reverse; align-items: flex-end; }
.nyc-feedback-panel { width: 22rem; max-width: calc(100vw - 2rem); background: var(--nyc-white); border: 1px solid var(--nyc-gray-border); border-radius: .5rem; box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.2); padding: 1rem; margin-top: .5rem; }

.nyc-step-list { counter-reset: step; list-style: none; padding: 0; }
.nyc-step-list li { counter-increment: step; position: relative; padding: .4rem 0 .4rem 2.4rem; }
.nyc-step-list li::before { content: counter(step); position: absolute; left: 0; top: .35rem; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--nyc-blue); color: var(--nyc-white); font-weight: 700; display: flex; align-items: center; justify-content: center; }

#blazor-error-ui { background: var(--nyc-warn-bg); color: var(--nyc-warn-ink); bottom: 0; box-shadow: 0 -1px 2px rgba(0,0,0,.2); display: none; left: 0; padding: .6rem 1.25rem .7rem; position: fixed; width: 100%; z-index: 1000; }
#blazor-error-ui .dismiss { background: none; border: 0; cursor: pointer; position: absolute; right: .75rem; top: .5rem; }

@media print {
    .nyc-env, .nyc-header, .nyc-nav, .nyc-footer, .nyc-savebar, .nyc-filters, .nyc-no-print, .btn, .skip-link, .nyc-feedback, #blazor-error-ui { display: none !important; }
    .nyc-shell { display: block; }
    .nyc-main { padding: 0; }
    .nyc-form-section, .nyc-card { border: 1px solid #999999; break-inside: avoid; }
    .nyc-history { max-height: none; overflow: visible; }
}

/* Reflow at 320 CSS px (WCAG 1.4.10): scroll containers are positioned so visually hidden text stays inside them,
   and the feedback button joins the page flow on small screens so it never covers the save bar. */
.nyc-table-wrap, .table-responsive, .nyc-history { position: relative; }
@media (max-width: 600px) {
    .nyc-feedback { position: static; margin: 0 1rem 1rem; }
    .nyc-header-inner { padding: .5rem 1rem; }
    .nyc-brand-app { border-left: none; padding-left: 0; margin-left: 0; flex-basis: 100%; }
    .nyc-brand-council { font-size: 1.35rem; }
    .nyc-signin-council { font-size: 1.6rem; }
}
.nyc-card, pre { overflow-wrap: anywhere; }

/* Email outbox: the message body keeps its line breaks (moved from an inline style for the content security policy). */
.nyc-email-body { white-space: pre-wrap; font-family: inherit; background: var(--nyc-surface); }

/* Utility classes that replace inline style attributes, so the content security policy allows no inline styles (docs/security/content-security-policy.md). */
.nyc-pre-wrap { white-space: pre-wrap; }
.nyc-bg-white { background: var(--nyc-white); }
.nyc-bg-surface { background: var(--nyc-surface); }
.nyc-scroll-12 { max-height: 12rem; overflow-y: auto; }
.nyc-minw-0 { min-width: 0; }
.nyc-minw-16 { min-width: 16rem; }
.nyc-w-12 { width: 12rem; }
.nyc-maxw-12 { max-width: 12rem; }
.nyc-maxw-14 { max-width: 14rem; }
.nyc-maxw-16 { max-width: 16rem; }
.nyc-maxw-18 { max-width: 18rem; }
.nyc-maxw-28 { max-width: 28rem; }
svg.nyc-swatch { display: inline-block; vertical-align: middle; }

/* Status badge fills: the StatusPalette constants (StatusPaletteCssTests keeps them equal). */
.nyc-status-accepted { background-color: #1e6b3a; }
.nyc-status-submitted { background-color: #2f56a6; }
.nyc-status-flagged { background-color: #cb4a3a; }
.nyc-status-updates-requested { background-color: #8a5a00; }
.nyc-status-draft { background-color: #23417d; }
.nyc-status-not-started { background-color: #767676; }