:root {
    --ink: #17223b;
    --muted: #64748b;
    --line: #dfe6ef;
    --paper: #ffffff;
    --wash: #f4f7fb;
    --brand: #0f766e;
    --brand-dark: #115e59;
    --accent: #d8a128;
    color-scheme: light;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--wash); line-height: 1.55; }
a { color: var(--brand-dark); text-underline-offset: .2em; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: .35rem; font-size: clamp(1.8rem, 4vw, 2.6rem); letter-spacing: -.035em; }
h2 { font-size: 1.2rem; }

.site-header { min-height: 72px; padding: 0 max(1rem, calc((100vw - 1180px) / 2)); display: flex; align-items: center; gap: 2rem; background: var(--paper); border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: .65rem; margin-right: auto; color: var(--ink); font-weight: 700; text-decoration: none; }
.brand-mark { display: grid; place-items: center; width: 42px; height: 42px; color: white; background: var(--brand); border-radius: 10px; font-size: .85rem; letter-spacing: .08em; }
.primary-nav { display: flex; align-self: stretch; gap: .2rem; }
.primary-nav a { display: inline-flex; align-items: center; padding: 0 .75rem; color: var(--muted); border-bottom: 3px solid transparent; font-size: .9rem; font-weight: 700; text-decoration: none; }
.primary-nav a:hover { color: var(--brand-dark); background: #f8fafc; }
.primary-nav a.is-active { color: var(--brand-dark); border-bottom-color: var(--brand); }
.header-utility { color: var(--brand-dark); font-size: .84rem; font-weight: 700; white-space: nowrap; }

.container { width: min(1180px, calc(100% - 2rem)); margin: 0 auto; padding: 3rem 0 5rem; }
.page-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.eyebrow { margin-bottom: .35rem; color: var(--brand); font-size: .76rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.muted, .empty { color: var(--muted); }
.panel { margin-bottom: 1.5rem; padding: 1.5rem; background: var(--paper); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 10px 35px rgba(23, 34, 59, .04); }
.narrow { max-width: 720px; }

.auth-card { width: min(440px, 100%); margin: 5vh auto; padding: clamp(1.5rem, 5vw, 2.5rem); background: var(--paper); border: 1px solid var(--line); border-top: 4px solid var(--accent); border-radius: 14px; box-shadow: 0 20px 60px rgba(23, 34, 59, .09); }
.stack { display: grid; gap: 1rem; margin-top: 1.75rem; }
label { display: grid; gap: .4rem; font-size: .9rem; font-weight: 700; }
input, select, textarea { width: 100%; min-height: 46px; padding: .7rem .8rem; color: var(--ink); background: white; border: 1px solid #b8c4d4; border-radius: 8px; font: inherit; }
input:focus { outline: 3px solid rgba(15, 118, 110, .18); border-color: var(--brand); }
select:focus, textarea:focus { outline: 3px solid rgba(15, 118, 110, .18); border-color: var(--brand); }
.button { display: inline-flex; justify-content: center; align-items: center; min-height: 42px; padding: .65rem 1rem; color: white; background: var(--brand); border: 0; border-radius: 8px; font: inherit; font-weight: 750; text-decoration: none; cursor: pointer; }
.button:hover { background: var(--brand-dark); }
.button-small { min-height: 32px; padding: .4rem .7rem; font-size: .84rem; }
.button-quiet { min-height: 36px; color: var(--ink); background: #eef2f6; }
.button-danger { color: white; background: #b42318; }
.button-danger:hover { background: #8a1c13; }
.field-error { margin: 0; color: #b42318; font-size: .9rem; }
.portal-switch { margin: 1.5rem 0 0; padding-top: 1rem; border-top: 1px solid var(--line); font-size: .9rem; }

.metrics { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin-bottom: 1.5rem; }
.metrics-three { grid-template-columns: repeat(3, 1fr); }
.metrics-four { grid-template-columns: repeat(4, 1fr); }
.metrics article { padding: 1.25rem 1.5rem; background: var(--ink); border-radius: 14px; color: white; }
.metrics article.metric-attention { background: #7f1d1d; }
.metrics span { display: block; color: #cbd5e1; font-size: .85rem; }
.metrics strong { display: block; margin-top: .15rem; font-size: 2rem; }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: .85rem .7rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: var(--muted); font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; }
.status { display: inline-flex; padding: .25rem .55rem; color: #115e59; background: #ccfbf1; border-radius: 999px; font-size: .78rem; font-weight: 750; white-space: nowrap; }
.details-grid, .card-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
dl { margin: 0; }
dl div { display: grid; grid-template-columns: 140px 1fr; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--line); }
dt { color: var(--muted); font-size: .86rem; }
dd { margin: 0; }
.document { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.document small, .comment small { color: var(--muted); }
.comment { padding: .9rem 0; border-bottom: 1px solid var(--line); }
.comment p { margin-bottom: .25rem; }
.package-card { padding: 1.25rem; border: 1px solid var(--line); border-radius: 10px; }
.price { color: var(--brand); font-size: 1.7rem; font-weight: 800; }
.notice { margin-bottom: 1rem; padding: .8rem 1rem; background: #ecfdf3; border: 1px solid #abefc6; border-radius: 8px; }
.back-link { display: inline-block; margin-bottom: 1rem; }
.search-form { display: grid; grid-template-columns: minmax(240px, 1fr) auto; align-items: end; gap: 1rem; margin-bottom: 1.5rem; }
.form-panel { max-width: 900px; }
.form-help { color: var(--muted); }
fieldset { margin: 0 0 1.5rem; padding: 0; border: 0; }
legend { width: 100%; margin-bottom: 1rem; padding-bottom: .5rem; border-bottom: 1px solid var(--line); font-size: 1.05rem; font-weight: 800; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.span-two { grid-column: span 2; }
.check-label { display: flex; align-items: center; align-self: end; min-height: 46px; }
.check-label input { width: 18px; min-height: 18px; margin-right: .55rem; }
.validation-summary { margin-bottom: 1.5rem; padding: 1rem; color: #8a1c13; background: #fff1f0; border: 1px solid #f4b4ad; border-radius: 8px; }
.validation-summary ul { margin-bottom: 0; }
.danger-panel { border-color: #f4b4ad; }
.form-actions { display: flex; justify-content: flex-end; gap: .75rem; }
.table-link { font-weight: 750; }
.heading-summary { margin-bottom: 0; color: var(--muted); }
.heading-badges { display: flex; align-items: center; gap: .5rem; }
.heading-actions { display: flex; align-items: center; justify-content: flex-end; gap: .75rem; }
.status-danger { color: #991b1b; background: #fee2e2; }
.report-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.report-summary article { min-width: 0; padding: 1rem 1.15rem; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; }
.report-summary span { display: block; margin-bottom: .2rem; color: var(--muted); font-size: .76rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.report-summary strong { display: block; overflow: hidden; font-size: 1rem; text-overflow: ellipsis; white-space: nowrap; }
.report-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 1.5rem; align-items: start; }
.report-main, .report-sidebar { min-width: 0; }
.workflow-form { display: grid; gap: 1rem; }
.workflow-form .button { width: 100%; }
.workflow-help { margin: 0; color: var(--muted); font-size: .8rem; }
.section-heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; margin-bottom: .5rem; }
.section-heading h2 { margin-bottom: 0; }
.record-id { color: var(--muted); font-size: .78rem; white-space: nowrap; }
.detail-list div { grid-template-columns: 150px minmax(0, 1fr); }
.sidebar-list div { display: block; }
.sidebar-list dt { margin-bottom: .15rem; }
.preserve-lines { white-space: pre-wrap; overflow-wrap: anywhere; }
.prose-block { margin-top: 1.25rem; }
.prose-block h3 { margin-bottom: .3rem; font-size: .9rem; }
.prose-block p { margin-bottom: 0; }
.timeline-comment { padding: 1rem 0; border-bottom: 1px solid var(--line); }
.timeline-comment:last-child { padding-bottom: 0; border-bottom: 0; }
.timeline-comment p { margin: .55rem 0 .35rem; }
.timeline-comment small { color: var(--muted); }
.comment-meta { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.visibility { padding: .18rem .45rem; border-radius: 999px; font-size: .72rem; font-weight: 750; white-space: nowrap; }
.visibility-client { color: #115e59; background: #ccfbf1; }
.visibility-internal { color: #475569; background: #e2e8f0; }
.file-reference { padding: .6rem .75rem; background: #fffbeb; border: 1px solid #fde68a; border-radius: 7px; font-size: .82rem; }
.file-reference code, .quarantine-notice code { overflow-wrap: anywhere; }
.file-reference span { display: block; color: #92400e; font-weight: 700; }
.document-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 0; border-bottom: 1px solid var(--line); }
.document-row small { display: block; color: var(--muted); }
.document-actions { display: flex; align-items: center; justify-content: flex-end; gap: .65rem; flex-wrap: wrap; }
.document-actions small { max-width: 15rem; text-align: right; }
.document-upload-form { display: grid; gap: .8rem; margin-bottom: 1rem; padding: 1rem; background: #f8fafc; border: 1px solid var(--line); border-radius: 9px; }
.document-upload-form label { display: grid; gap: .45rem; font-weight: 700; }
.document-upload-form label small { color: var(--muted); font-weight: 400; }
.document-upload-form .button { justify-self: start; }
.scan-status { padding: .2rem .5rem; color: #92400e; background: #fef3c7; border-radius: 999px; font-size: .74rem; font-weight: 750; }
.scan-clean { color: #166534; background: #dcfce7; }
.scan-infected, .scan-failed { color: #991b1b; background: #fee2e2; }
.quarantine-notice { margin-top: 1rem; padding: 1rem; color: #78350f; background: #fffbeb; border: 1px solid #fcd34d; border-radius: 9px; }
.quarantine-notice p { margin: .25rem 0 .75rem; }
.quarantine-notice div { display: grid; grid-template-columns: 85px minmax(0, 1fr); gap: .5rem; margin-top: .35rem; }
.subheading { margin: 1.25rem 0 .45rem; font-size: .9rem; }
.compact-list { margin: 0; padding-left: 1.2rem; }
.compact-list small { color: var(--muted); }
.pagination { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.25rem; }
.pagination-summary { margin: 0; color: var(--muted); font-size: .86rem; }
.pagination-links { display: flex; align-items: center; justify-content: flex-end; gap: .3rem; flex-wrap: wrap; }
.pagination-control, .pagination-page, .pagination-ellipsis { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; min-height: 36px; padding: .35rem .65rem; border: 1px solid var(--line); border-radius: 7px; font-size: .86rem; text-decoration: none; }
.pagination-control, .pagination-page { color: var(--ink); background: var(--paper); }
.pagination-control:hover, .pagination-page:hover { color: white; background: var(--brand); border-color: var(--brand); }
.pagination-page.is-current { color: white; background: var(--brand); border-color: var(--brand); font-weight: 800; }
.pagination-control.is-disabled { color: #94a3b8; background: #f8fafc; cursor: not-allowed; }
.pagination-ellipsis { min-width: auto; padding-right: .25rem; padding-left: .25rem; border-color: transparent; }
.filter-panel { padding-bottom: 1rem; }
.report-filter-form { display: grid; gap: 1.15rem; }
.filter-search-row { display: grid; grid-template-columns: minmax(260px, 1fr) auto; align-items: end; gap: 1rem; }
.filter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .85rem 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.filter-date-range { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.filter-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.filter-footer p { margin: 0; color: var(--muted); font-size: .9rem; }
.filter-footer strong { color: var(--ink); }
.sort-link { display: inline-flex; align-items: center; gap: .25rem; color: var(--muted); text-decoration: none; white-space: nowrap; }
.sort-link:hover { color: var(--brand-dark); }
.sort-link span { color: var(--brand); font-size: .9rem; }
.self-protection-notice { margin-bottom: 1.5rem; padding: .8rem 1rem; color: #1e3a8a; background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 8px; }
.employee-filter-form { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(180px, 260px) auto; align-items: end; gap: 1rem; margin-bottom: 1.5rem; }
.tools-tabs { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.5rem; padding-bottom: .5rem; border-bottom: 1px solid var(--line); }
.tools-tab { display: inline-flex; align-items: center; min-height: 40px; padding: .55rem 1rem; color: var(--muted); border: 1px solid transparent; border-radius: 8px; font-weight: 750; text-decoration: none; }
.tools-tab:hover { color: var(--brand-dark); background: #f8fafc; }
.tools-tab.is-active { color: var(--brand-dark); background: #eff6ff; border-color: #bfdbfe; }
.tools-filter-form { display: grid; grid-template-columns: minmax(280px, 1fr) minmax(150px, 210px) minmax(130px, 170px) auto; align-items: end; gap: 1rem; margin: 1rem 0 1.5rem; }
.tools-filter-actions { display: flex; gap: .6rem; }
.audit-details summary { color: var(--brand-dark); cursor: pointer; font-weight: 700; white-space: nowrap; }
.audit-metadata { max-width: 28rem; margin: .6rem 0 0; padding: .75rem; overflow: auto; color: #334155; background: #f8fafc; border: 1px solid var(--line); border-radius: 7px; font-size: .76rem; white-space: pre-wrap; }
.audit-outcome-success { color: #166534; background: #dcfce7; }
.audit-outcome-denied, .audit-outcome-failure { color: #991b1b; background: #fee2e2; }
.tools-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.tools-summary-grid div { display: block; padding: 1rem; background: #f8fafc; border: 1px solid var(--line); border-radius: 9px; }
.tools-summary-grid dt { margin-bottom: .25rem; }
.tools-summary-grid dd { font-weight: 750; }
.tools-safety-note { margin: 1rem 0 0; padding: .75rem 1rem; color: #475569; background: #f8fafc; border-left: 4px solid var(--brand); font-size: .86rem; }
.preview-banner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem max(1rem, calc((100vw - 1180px) / 2)); color: #78350f; background: #fef3c7; border-bottom: 1px solid #f59e0b; }
.preview-banner div { display: flex; align-items: baseline; gap: .75rem; }
.preview-banner strong { white-space: nowrap; }
.preview-return { color: #fff; background: #92400e; }
.preview-return:hover { background: #78350f; }
.is-client-preview .site-header { border-bottom-color: #f59e0b; }
.preview-panel { max-width: 900px; }
.preview-company-form, .preview-client-form { display: grid; grid-template-columns: minmax(280px, 1fr) auto; align-items: end; gap: 1rem; }
.preview-selection { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.table-secondary { display: block; margin-top: .15rem; color: var(--muted); font-size: .78rem; }
.statistics-filter-form { display: grid; grid-template-columns: repeat(3, minmax(150px, 1fr)) auto auto; align-items: end; gap: 1rem; }
.statistics-layout { display: grid; grid-template-columns: minmax(0, 3fr) minmax(260px, 2fr); gap: 1.5rem; }
.bar-list { display: grid; gap: 1rem; }
.bar-row > div:first-child { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .3rem; font-size: .86rem; }
.bar-track { height: 9px; overflow: hidden; background: #e2e8f0; border-radius: 999px; }
.bar-track span { display: block; height: 100%; background: var(--brand); border-radius: inherit; }
.monthly-list { display: grid; gap: .25rem; max-height: 330px; overflow-y: auto; }
.monthly-list div { display: flex; justify-content: space-between; gap: 1rem; padding: .5rem 0; border-bottom: 1px solid var(--line); }
.monthly-list span { color: var(--muted); }
.catalog-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.catalog-actions { flex-wrap: wrap; }
.catalog-actions .button { min-height: 36px; padding: .45rem .7rem; font-size: .82rem; }
.catalog-history-notice { color: #1e3a8a; background: #eff6ff; border-color: #bfdbfe; }
.catalog-checkbox-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem 1rem; }
.catalog-checkbox { display: flex; align-items: flex-start; gap: .7rem; padding: .75rem; background: #f8fafc; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; }
.catalog-checkbox input { flex: 0 0 18px; width: 18px; min-height: 18px; margin-top: .15rem; }
.catalog-checkbox span { font-weight: 700; }
.catalog-checkbox small { display: block; color: var(--muted); font-weight: 400; }
.compact-record-list article { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--line); }
.compact-record-list article:last-child { border-bottom: 0; }
.compact-record-list small { display: block; margin-top: .15rem; color: var(--muted); }

/* Client portal: based on the verified legacy workflow, with the replacement security model. */
.client-portal { --client-red: #c1121f; --client-charcoal: #34424d; color: #283845; background: #fff; }
.client-site-header { width: min(1540px, calc(100% - 2rem)); min-height: 130px; margin: 0 auto; padding: 1rem 0; border-bottom: 0; }
.client-site-header .brand { align-self: flex-start; margin-top: .8rem; max-width: 230px; color: #27344f; line-height: 1.1; text-transform: uppercase; }
.client-site-header .brand-mark { width: 64px; height: 64px; background: #27344f; border-radius: 50%; }
.client-header-area { display: grid; align-self: stretch; margin-left: auto; }
.client-account-line { display: flex; align-items: start; justify-content: flex-end; gap: 1rem; font-size: .9rem; }
.client-account-line form { padding-left: 1rem; border-left: 1px solid #aab2ba; }
.link-button { padding: 0; color: var(--client-red); background: transparent; border: 0; font: inherit; cursor: pointer; }
.client-primary-nav { align-self: end; justify-content: flex-end; gap: 2rem; }
.client-primary-nav a { padding: .75rem 0; color: #394753; border: 0; font-size: 1.08rem; font-weight: 500; letter-spacing: .02em; text-transform: uppercase; }
.client-primary-nav a:hover { color: var(--client-red); background: transparent; }
.client-primary-nav a.is-active { color: var(--client-red); border: 0; }
.client-container { width: min(1540px, calc(100% - 2rem)); padding-top: 1rem; }
.client-hero { display: flex; align-items: center; gap: 2rem; min-height: 205px; margin-bottom: 4rem; padding: 2rem clamp(2rem, 8vw, 8rem); overflow: hidden; color: white; background: linear-gradient(110deg, #1c2c48 0%, #164b78 42%, #193352 67%, #101827 100%); border-radius: 2px; box-shadow: 0 24px 40px rgba(27, 45, 70, .16); }
.client-hero::after { content: ''; width: 420px; height: 220px; margin-left: auto; background: radial-gradient(circle at 25% 50%, rgba(115, 213, 248, .7), transparent 18%), repeating-linear-gradient(90deg, transparent 0 18px, rgba(255,255,255,.06) 19px 20px); transform: skewX(-18deg); }
.client-hero p { margin-bottom: .25rem; color: #acd4e8; font-size: .86rem; letter-spacing: .16em; text-transform: uppercase; }
.client-hero strong { display: block; max-width: 520px; font-size: clamp(1.45rem, 3vw, 2.45rem); line-height: 1.15; }
.client-hero-lock { position: relative; flex: 0 0 124px; width: 124px; height: 124px; border: 3px solid rgba(255,255,255,.38); border-radius: 50%; box-shadow: 0 0 0 18px rgba(148, 213, 236, .1); }
.client-hero-lock::before { content: ''; position: absolute; top: 25px; left: 39px; width: 40px; height: 42px; border: 7px solid #9bd7ec; border-bottom: 0; border-radius: 22px 22px 0 0; }
.client-hero-lock span { position: absolute; top: 59px; left: 34px; width: 52px; height: 43px; background: #d7eff7; border-radius: 4px; }
.client-hero-lock span::after { content: ''; position: absolute; top: 13px; left: 23px; width: 7px; height: 16px; background: #31536f; border-radius: 4px; }
.client-page-heading { margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 1px solid #e5e7eb; }
.client-page-heading h1 { margin-bottom: .2rem; color: #31414e; font-size: clamp(2rem, 4vw, 3.1rem); font-weight: 300; letter-spacing: -.02em; text-transform: uppercase; }
.client-page-heading p { margin: 0; color: #75818b; }
.client-filter-panel { border: 0; border-radius: 0; box-shadow: none; padding: 0 0 2rem; }
.client-report-filters { display: grid; gap: 1rem; }
.client-search-field { max-width: 820px; color: #66727c; font-size: 1rem; font-weight: 400; }
.client-filter-grid { display: grid; grid-template-columns: repeat(6, minmax(125px, 1fr)); gap: .8rem; }
.filter-actions { display: flex; align-items: center; justify-content: flex-end; gap: 1rem; }
.client-action { background: var(--client-red); }
.client-action:hover { background: #98101a; }
.client-report-group { margin: 2.5rem 0; }
.client-report-group > h2 { color: #34424d; font-size: 1.8rem; font-weight: 400; }
.client-report-list { overflow: hidden; border: 1px solid #e1e5e8; border-radius: 8px; }
.client-report-list-head, .client-report-row summary { display: grid; grid-template-columns: 1.45fr 1.35fr .7fr .9fr .85fr .65fr; gap: 1rem; align-items: center; }
.client-report-list-head { padding: 1rem 1.25rem; color: white; background: var(--client-charcoal); font-size: .76rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.client-report-row { border-bottom: 1px solid #e1e5e8; }
.client-report-row:last-child { border-bottom: 0; }
.client-report-row summary { padding: 1.25rem; cursor: pointer; list-style: none; }
.client-report-row summary::-webkit-details-marker { display: none; }
.client-report-row summary:hover { background: #fafafa; }
.client-report-row[open] summary { position: relative; background: #fff; box-shadow: 0 12px 25px rgba(36, 51, 66, .09); }
.client-report-row[open] summary::after { content: ''; position: absolute; bottom: -11px; left: 50%; width: 22px; height: 22px; background: white; transform: rotate(45deg); }
.report-reference { color: var(--client-red); font-weight: 650; }
.client-status { color: var(--client-red); font-weight: 650; white-space: nowrap; }
.client-status.is-cancelled { color: #a50f1a; }
.client-report-expanded { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2rem; align-items: end; padding: 2.5rem 2rem 2rem; background: #fbfbfb; }
.client-report-expanded dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 2rem; }
.client-report-expanded dl div { grid-template-columns: 130px 1fr; }
.client-profile-panel { max-width: 820px; border: 0; box-shadow: none; }
.client-profile-panel h2 { margin-bottom: 2rem; font-size: 1.45rem; font-weight: 400; }
.client-profile-panel h2 span { color: var(--client-red); }
.profile-help { margin-top: 2.5rem; padding: 1.25rem; color: #56616b; background: #fafafa; border: 1px solid #e0e4e7; border-radius: 10px; }

.client-request-form { margin-bottom: 3rem; }
.request-progress { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 0 0 1.5rem; padding: 0; list-style: none; }
.request-progress li { position: relative; display: flex; align-items: center; gap: .65rem; color: #9aa2aa; }
.request-progress li::after { content: ''; position: absolute; top: 19px; left: 47px; right: 8px; height: 2px; background: #e1e5e8; }
.request-progress li:last-child::after { display: none; }
.request-progress strong { z-index: 1; display: grid; place-items: center; width: 38px; height: 38px; color: #7b8791; background: white; border: 2px solid #cdd3d8; border-radius: 50%; }
.request-progress .is-active { color: #33424f; }
.request-progress .is-active strong { color: white; background: var(--client-red); border-color: var(--client-red); }
.request-progress .is-active::after { background: var(--client-red); }
.request-step { min-height: 420px; padding: clamp(1.5rem, 5vw, 3.5rem); border: 0; border-radius: 0; box-shadow: none; }
.request-step[hidden], [data-subject-section][hidden], [data-add-on-type][hidden] { display: none !important; }
.request-step-heading { display: flex; align-items: baseline; gap: 1rem; margin-bottom: 2.5rem; }
.request-step-heading > strong, .request-step-heading > div > strong { color: var(--client-red); font-size: 1.25rem; }
.request-step-heading h2 { margin: 0; color: #34424d; font-size: 1.65rem; font-weight: 400; }
.split-heading { align-items: start; justify-content: space-between; }
.split-heading > div { display: flex; align-items: baseline; gap: 1rem; }
.split-heading > p { color: var(--client-red); font-style: italic; font-weight: 700; }
.request-type-options, .subject-options { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; }
.request-choice { display: flex; align-items: center; gap: .65rem; color: #67727d; font-size: 1.2rem; font-weight: 400; cursor: pointer; }
.request-choice input { width: 20px; min-height: 20px; }
.add-on-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem 3rem; }
.add-on-choice { display: flex; align-items: flex-start; gap: .75rem; color: #56636e; font-weight: 400; cursor: pointer; }
.add-on-choice input { flex: 0 0 20px; width: 20px; min-height: 20px; margin-top: .25rem; }
.add-on-choice strong { display: block; font-size: 1.02rem; font-weight: 500; }
.add-on-choice small { display: block; margin-top: .2rem; color: #26313a; line-height: 1.45; }
.subject-options { margin-bottom: 2.5rem; }
.request-detail-grid { gap: 1.35rem 3rem; }
.request-common-fields { margin-top: 1.35rem; }
.request-detail-grid label { color: #78838c; font-size: 1rem; font-weight: 400; }
.request-detail-grid textarea { resize: vertical; }
.request-step-actions { display: flex; align-items: center; justify-content: space-between; margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid #e6e9eb; }
.request-step-actions .button { min-width: 130px; }
.request-step-actions button:disabled { background: #9ca3af; cursor: not-allowed; }

@media (max-width: 760px) {
    .site-header { flex-wrap: wrap; gap: .75rem; padding-top: .75rem; padding-bottom: .75rem; }
    .primary-nav { order: 3; width: 100%; min-height: 46px; overflow-x: auto; }
    .container { padding-top: 2rem; }
    .page-heading { align-items: start; flex-direction: column; }
    .metrics, .metrics-three, .metrics-four, .details-grid, .card-grid { grid-template-columns: 1fr; }
    .form-grid, .search-form { grid-template-columns: 1fr; }
    .span-two { grid-column: auto; }
    .report-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .report-layout { grid-template-columns: 1fr; }
    .report-heading { flex-direction: row; align-items: end; }
    .pagination { align-items: flex-start; flex-direction: column; }
    .pagination-links { justify-content: flex-start; }
    .filter-search-row, .filter-grid, .employee-filter-form, .tools-filter-form, .tools-summary-grid, .preview-company-form, .preview-client-form { grid-template-columns: 1fr; }
    .filter-footer { align-items: flex-start; flex-direction: column; }
    .preview-banner, .preview-banner div { align-items: flex-start; flex-direction: column; }
    .statistics-filter-form, .statistics-layout, .catalog-columns, .catalog-checkbox-grid { grid-template-columns: 1fr; }
    .heading-actions { align-items: stretch; flex-direction: column; width: 100%; }
    .client-site-header { align-items: flex-start; min-height: auto; }
    .client-header-area { width: 100%; }
    .client-account-line { justify-content: flex-start; }
    .client-primary-nav { justify-content: flex-start; gap: 1.25rem; }
    .client-hero { min-height: 150px; margin-bottom: 2.5rem; padding: 1.5rem; }
    .client-hero-lock, .client-hero::after { display: none; }
    .client-filter-grid, .add-on-grid { grid-template-columns: 1fr; }
    .client-report-list-head { display: none; }
    .client-report-row summary { grid-template-columns: 1fr 1fr; }
    .client-report-row summary span:nth-child(n+5) { display: none; }
    .client-report-expanded { grid-template-columns: 1fr; }
    .client-report-expanded dl { grid-template-columns: 1fr; }
    .request-progress li span { display: none; }
    .request-progress li::after { left: 42px; }
    .request-type-options, .subject-options { align-items: flex-start; flex-direction: column; }
    .split-heading { flex-direction: column; }
}

@media (max-width: 480px) {
    .report-summary { grid-template-columns: 1fr; }
    .report-heading, .section-heading, .comment-meta, .document-row { align-items: start; flex-direction: column; }
}