:root {
    font-family: system-ui, sans-serif;
    color: #20352c;
    background: #f3f6f3;
}

body { margin: 0; background: #f3f6f3; }
a { color: #195d3b; }
.app-header { background: #194d35; color: white; padding: 1.2rem 2rem; display: flex; gap: 2rem; align-items: center; }
.brand { font-size: 1.65rem; font-weight: 700; color: white; text-decoration: none; }
.app-nav { padding: .5rem 2rem; background: #e0ebe2; display: flex; flex-wrap: wrap; gap: .25rem; }
.app-nav a { padding: .6rem .8rem; border-radius: 4px; text-decoration: none; font-weight: 600; }
.app-nav a:hover, .app-nav a.active { background: #c8ddce; }
.shell main { max-width: 1400px; margin: auto; padding: 2rem; min-width: 0; }
.page-surface { padding: 2rem; min-width: 0; }
.page-surface .page-title { font-size: 1.8rem; font-weight: 600; line-height: 1.3; margin-bottom: 1.5rem; }
.page-surface .section-title { font-size: 1.25rem; font-weight: 600; line-height: 1.4; margin: 1.5rem 0 1rem; }
.page-surface .card-title { font-size: 1.25rem; font-weight: 600; line-height: 1.4; margin-bottom: 1rem; }
.edit-form { max-width: 48rem; }
.form-actions, .row-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.page-surface .number-cell { text-align: right; font-variant-numeric: tabular-nums; }
.page-surface .record-id { overflow-wrap: anywhere; }
.page-surface .audit-info { margin-top: 1.5rem; color: #52675b; overflow-wrap: anywhere; }
.page-surface .validation-errors { color: #a02020; margin-bottom: 1rem; }

/* Identity remains a static HTTP form; these rules never target MudBlazor inputs. */
.identity-page, .static-page { background: white; border: 1px solid #d5dfd8; border-radius: 4px; padding: 2rem; max-width: 40rem; margin: auto; }
.identity-page h1, .static-page h1 { font-size: 1.8rem; font-weight: 600; margin-bottom: 1.5rem; }
.identity-page p, .static-page p { margin: 1rem 0; }
.identity-page [role=status]:empty { display: none; }
.identity-page [role=status]:not(:empty) { padding: 1rem; border: 1px solid #95aa9b; border-radius: 4px; overflow-wrap: anywhere; }
.identity-page label { display: flex; flex-direction: column; gap: .5rem; margin: 1rem 0 1.5rem; }
.identity-page input:not([type=hidden]) { box-sizing: border-box; width: 100%; font: inherit; padding: 1rem .9rem; border: 1px solid #95aa9b; border-radius: 4px; background: white; color: #20352c; }
.identity-page input:focus { outline: 2px solid #195d3b; outline-offset: 1px; }
.identity-page button { font: inherit; font-weight: 600; background: #195d3b; color: white; padding: .65rem 1.1rem; border: 0; border-radius: 4px; cursor: pointer; min-height: 40px; }
.identity-page button:disabled { opacity: .45; cursor: default; }
.identity-page .validation-message, .identity-page .validation-errors { color: #a02020; }
#blazor-error-ui { display: none; background: #ffe1a0; position: fixed; bottom: 0; width: 100%; padding: 1rem; z-index: 2000; }
#blazor-error-ui .dismiss { float: right; margin-right: 2rem; }

@media (max-width: 700px) {
    .shell main { padding: .75rem; }
    .app-header { padding: 1rem; }
    .app-header span { display: none; }
    .app-nav { padding: .5rem; }
    .app-nav a { padding: .6rem; }
    .page-surface, .identity-page, .static-page { padding: 1rem; }
    .page-surface .page-title { font-size: 1.5rem; }
}