:root {
  --bg: #f3f6fa;
  --surface: #ffffff;
  --surface-2: #f8fafc;
  --ink: #152033;
  --muted: #687386;
  --line: #dfe6ef;
  --navy: #0c1b31;
  --navy-2: #132a4c;
  --blue: #2563eb;
  --blue-dark: #1748b7;
  --green: #16865a;
  --amber: #c57b00;
  --red: #c73e3e;
  --shadow: 0 10px 30px rgba(21, 32, 51, .07);
  --shadow-hover: 0 16px 36px rgba(21, 32, 51, .12);
  --radius: 16px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--ink); }
body { line-height: 1.45; }
a { color: var(--blue); text-decoration: none; }
a:hover { color: var(--blue-dark); }
button, input, select, textarea { font: inherit; }
button, a { transition: all .16s ease; }
code, .mono { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.topbar { height: 76px; background: linear-gradient(100deg, var(--navy), var(--navy-2)); color: white; display: flex; align-items: center; justify-content: space-between; padding: 0 28px; position: fixed; inset: 0 0 auto 0; z-index: 50; box-shadow: 0 6px 18px rgba(4, 12, 24, .18); }
.brand, .profile-link { color: white; display: flex; align-items: center; gap: 12px; }
.brand:hover, .profile-link:hover { color: white; }
.brand span:last-child, .profile-text { display: flex; flex-direction: column; }
.brand small, .profile-text small { color: rgba(255,255,255,.62); font-size: 12px; font-weight: 500; }
.brand-mark { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: linear-gradient(135deg, #4f8cff, #7aa8ff); color: white; font-weight: 800; box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); }
.brand-mark-large { width: 56px; height: 56px; font-size: 24px; }
.top-actions { display: flex; align-items: center; gap: 14px; }
.environment-badge, .planned-badge, .tiny-badge { display: inline-flex; align-items: center; border-radius: 999px; font-weight: 700; letter-spacing: .03em; }
.environment-badge { padding: 5px 10px; background: #ffd166; color: #5d4200; font-size: 12px; }
.icon-link { min-width: 36px; height: 36px; border: 1px solid rgba(255,255,255,.2); border-radius: 9px; display: grid; place-items: center; color: white; font-weight: 700; }
.icon-link:hover { background: rgba(255,255,255,.1); color: white; }
.avatar { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.18); font-weight: 800; }
.profile-text { min-width: 150px; }
.ghost-button { background: transparent; color: rgba(255,255,255,.76); border: 0; padding: 8px; cursor: pointer; }
.ghost-button:hover { color: white; }
.app-shell { display: grid; grid-template-columns: 245px minmax(0, 1fr); min-height: 100vh; padding-top: 76px; }
.app-shell.app-shell-full { grid-template-columns: minmax(0, 1fr); }
.sidebar { background: #fbfcfe; border-right: 1px solid var(--line); position: fixed; left: 0; top: 76px; bottom: 0; width: 245px; display: flex; flex-direction: column; justify-content: space-between; padding: 16px 12px; overflow-y: auto; }
.nav-link { display: flex; align-items: center; gap: 12px; color: #41506a; padding: 10px 12px; border-radius: 10px; margin-bottom: 3px; font-weight: 620; font-size: 14px; }
.nav-link span { width: 20px; text-align: center; color: #70809b; }
.nav-link:hover { background: #edf3fc; color: var(--navy); }
.nav-link.active { background: #e7efff; color: #1b52bd; }
.nav-section { font-size: 10px; text-transform: uppercase; letter-spacing: .14em; color: #9aa5b6; font-weight: 800; padding: 18px 12px 7px; }
.nav-group { margin: 4px 0; border: 0; border-radius: 10px; background: transparent; overflow: hidden; }
.nav-group summary { display: grid; grid-template-columns: 26px minmax(0,1fr) 12px; align-items: center; gap: 9px; min-height: 44px; padding: 8px 10px; list-style: none; border-radius: 10px; color: #41506a; font-size: 12px; font-weight: 720; }
.nav-group summary::-webkit-details-marker { display: none; }
.nav-group summary:hover, .nav-group[open] > summary { background: #edf3fc; color: var(--navy); }
.nav-group-icon { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; background: #e7effa; color: #5277a8; font-size: 13px; }
.nav-group-label { min-width: 0; line-height: 1.25; }
.nav-group-chevron { width: 7px; height: 7px; border-right: 2px solid #91a0b4; border-bottom: 2px solid #91a0b4; transform: rotate(45deg); transition: transform .16s ease; }
.nav-group[open] .nav-group-chevron { transform: rotate(225deg); }
.nav-submenu { margin: 3px 0 7px 22px; padding: 1px 0 1px 9px; border-left: 1px solid #dce5f0; background: transparent; }
.nav-submenu .nav-link { padding: 8px 9px; margin: 2px 0; font-size: 12px; border-radius: 8px; }
.nav-submenu .nav-link span { color: #8290a4; }
.sidebar-footer { border-top: 1px solid var(--line); padding: 16px 10px 2px; color: #7b8798; font-size: 12px; display: flex; align-items: center; gap: 8px; }
.status-light { width: 8px; height: 8px; background: #28a66a; border-radius: 50%; box-shadow: 0 0 0 4px rgba(40,166,106,.12); }
.content { grid-column: 2; min-width: 0; padding: 28px; }
.content.content-full { grid-column: 1; width: 100%; max-width: none; margin: 0; padding: 28px; }
.hero { color: white; background: linear-gradient(125deg, #10213c 0%, #1d4779 68%, #2465aa 100%); padding: 30px 34px; border-radius: 20px; box-shadow: 0 18px 45px rgba(15, 41, 76, .18); display: flex; justify-content: space-between; gap: 28px; align-items: center; }
.hero h1 { margin: 2px 0 8px; font-size: clamp(28px, 3vw, 42px); }
.hero p { margin: 0; max-width: 780px; color: rgba(255,255,255,.78); }
.hero .eyebrow { color: #90b8ed; }
.hero-summary { min-width: 250px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.08); border-radius: 14px; padding: 18px; display: flex; flex-direction: column; }
.hero-summary span { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #a9c7ec; }
.hero-summary strong { font-size: 18px; margin: 4px 0; }
.hero-summary small { color: rgba(255,255,255,.68); }
.eyebrow { color: #4876b1; text-transform: uppercase; letter-spacing: .13em; font-size: 11px; font-weight: 850; margin: 0 0 5px; }
.section-heading, .page-heading, .panel-heading, .module-card-head, .role-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }
.section-heading { margin: 30px 0 14px; align-items: end; }
.section-heading h2, .panel-heading h2, .role-card h2 { margin: 0; }
.section-note { color: var(--muted); font-size: 12px; }
.page-heading { margin-bottom: 22px; align-items: center; }
.page-heading h1 { margin: 0 0 5px; font-size: 30px; }
.page-heading p { margin: 0; color: var(--muted); }
.module-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.module-card, .panel, .kpi-card, .audit-workspace-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.module-card { padding: 18px; display: flex; flex-direction: column; min-height: 285px; }
.module-card h3 { margin: 2px 0 0; font-size: 18px; }
.module-card > p { color: var(--muted); font-size: 13px; min-height: 57px; }
.module-number { color: var(--blue); font-size: 10px; text-transform: uppercase; letter-spacing: .1em; font-weight: 850; }
.health-dot { width: 10px; height: 10px; border-radius: 50%; margin-top: 5px; }
.health-dot.online { background: #25a66d; box-shadow: 0 0 0 4px rgba(37,166,109,.12); }
.health-dot.offline { background: #e59a22; box-shadow: 0 0 0 4px rgba(229,154,34,.13); }
.module-status { display: flex; flex-wrap: wrap; gap: 8px 14px; font-size: 11px; color: var(--muted); border-top: 1px solid var(--line); padding-top: 11px; }
.success-text { color: var(--green); }
.warning-text { color: var(--amber); }
.module-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin: 12px 0 15px; }
.module-metrics div { background: var(--surface-2); border: 1px solid #edf1f6; border-radius: 9px; padding: 8px; }
.module-metrics span { display: block; color: var(--muted); font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.module-metrics strong { font-size: 16px; }
.module-card .secondary-button { margin-top: auto; align-self: flex-start; }
.dashboard-module-grid .module-card { min-height: 245px; }
.module-card-featured { border-color: #9fc0ea; background: linear-gradient(145deg,#fff,#f3f8ff); }
.system-facts { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.system-essential-card { display: grid; grid-template-columns: 42px minmax(0,1fr); gap: 13px; align-items: center; min-height: 112px; padding: 18px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.system-essential-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 11px; background: #edf3fd; color: var(--blue); font-size: 17px; font-weight: 850; }
.system-essential-card > div { min-width: 0; }
.system-essential-label { display: block; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.system-essential-card strong { display: block; margin-top: 4px; font-size: 17px; overflow-wrap: anywhere; }
.system-essential-card small { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; }
.placeholder-card { background: linear-gradient(145deg, #fff, #f7f9fc); border-style: dashed; box-shadow: none; }
.planned-badge { padding: 4px 8px; background: #edf1f7; color: #718097; font-size: 9px; text-transform: uppercase; }
.placeholder-lines { display: grid; gap: 9px; margin-top: auto; }
.placeholder-lines span { height: 8px; border-radius: 99px; background: #edf1f6; }
.placeholder-lines span:nth-child(2) { width: 78%; }
.placeholder-lines span:nth-child(3) { width: 55%; }
.audit-workspace-card { margin-top: 16px; padding: 22px; display: flex; justify-content: space-between; align-items: center; border-left: 4px solid #7657c8; }
.audit-workspace-card h2 { margin: 0 0 6px; }
.audit-workspace-card p { margin: 0; color: var(--muted); }
.kpi-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.kpi-card { padding: 15px; border-left: 4px solid #9aa8ba; box-shadow: 0 6px 18px rgba(21,32,51,.045); }
.kpi-card span { display: block; min-height: 34px; color: var(--muted); font-size: 11px; }
.kpi-card strong { font-size: 25px; }
.kpi-card.success { border-left-color: var(--green); }
.kpi-card.warning { border-left-color: var(--amber); }
.kpi-card.danger { border-left-color: var(--red); }
.two-column-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 18px; }
.two-column-grid.wide-left { grid-template-columns: minmax(0, 1.65fr) minmax(330px, .75fr); }
.panel { padding: 20px; }
.panel-heading { align-items: center; margin-bottom: 15px; }
.panel-heading a { font-size: 13px; }
.attention-list, .activity-list, .record-list { display: grid; }
.attention-item { display: flex; justify-content: space-between; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--line); color: var(--ink); }
.attention-item:last-child { border-bottom: 0; }
.attention-item strong { font-size: 20px; }
.attention-item.warning strong { color: var(--amber); }
.attention-item.danger strong { color: var(--red); }
.activity-item { display: flex; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.activity-item:last-child { border-bottom: 0; }
.activity-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; background: #edf3fd; color: var(--blue); font-weight: 800; }
.activity-item p, .activity-item small { margin: 0; color: var(--muted); font-size: 12px; }
.alert { border: 1px solid; border-radius: 11px; padding: 12px 14px; margin-bottom: 16px; display: flex; justify-content: space-between; gap: 15px; }
.alert-warning { background: #fff8e8; border-color: #f3d28e; color: #72510a; }
.alert-info { background: #eef5ff; border-color: #b9d2f3; color: #234f82; }
.alert-danger { background: #fff0f0; border-color: #efb2b2; color: #902b2b; }
.alert-success { background: #effbf5; border-color: #aee1c7; color: #176944; }
.primary-button, .secondary-button, .danger-button, .mini-button { display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; font-weight: 750; cursor: pointer; border: 0; }
.primary-button { background: var(--blue); color: white; padding: 10px 15px; }
.primary-button:hover { background: var(--blue-dark); color: white; transform: translateY(-1px); }
.secondary-button { background: #eef3fb; color: #284c7d; padding: 9px 13px; border: 1px solid #d8e2f1; }
.secondary-button:hover { background: #e3ebf7; color: #183a68; }
.danger-button { background: #c83f3f; color: white; padding: 10px 15px; }
.danger-button:hover { background: #a92f2f; color: white; transform: translateY(-1px); }
.danger-button.compact { min-width: 32px; min-height: 32px; padding: 5px 8px; }
.mini-button { background: #eaf1fc; color: var(--blue); padding: 6px 9px; }
.full-width { width: 100%; }
.mt-2 { margin-top: 10px; }
.stack-form { display: grid; gap: 14px; }
.form-divider { height: 1px; background: #e5eaf2; margin: 4px 0 2px; }
.stack-form label, .form-grid label { color: #46536a; font-size: 12px; font-weight: 730; display: grid; gap: 6px; }
input, select, textarea { width: 100%; background: white; color: var(--ink); border: 1px solid #cfd8e5; border-radius: 9px; padding: 10px 11px; outline: none; }
input:focus, select:focus, textarea:focus { border-color: #6a96e8; box-shadow: 0 0 0 3px rgba(58,111,213,.12); }
input:disabled, select:disabled { background: #f0f3f7; color: #7c8796; }
textarea { min-height: 90px; resize: vertical; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-row { display: flex; gap: 20px; align-items: center; }
.inline-form { display: inline-flex; align-items: center; gap: 7px; margin: 0; }
.compact-select { width: auto; min-width: 128px; padding: 6px 8px; font-size: 11px; }
fieldset { border: 1px solid var(--line); border-radius: 12px; padding: 14px; margin: 0; }
legend { padding: 0 8px; color: #4d5c72; font-weight: 800; font-size: 12px; }
.checkbox-grid, .permission-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.permission-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.check-card, .permission-card { display: flex !important; grid-template-columns: none !important; align-items: flex-start; gap: 10px !important; border: 1px solid var(--line); border-radius: 10px; padding: 10px; cursor: pointer; background: var(--surface-2); }
.check-card input, .permission-card input, .toggle input { width: auto; margin-top: 3px; }
.check-card span, .permission-card span { display: flex; flex-direction: column; min-width: 0; }
.check-card small, .permission-card small { color: var(--muted); font-weight: 500; }
.permission-card em { font-style: normal; font-size: 9px; color: #527db3; text-transform: uppercase; margin-top: 4px; }
.toggle { display: flex !important; align-items: center; gap: 8px !important; cursor: pointer; }
.mfa-policy-control { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 10px; min-width: 190px; }
.mfa-policy-form { margin: 0; }
.mfa-policy-toggle { color: #334155; font-size: 11px; font-weight: 800; white-space: nowrap; }
.mfa-policy-toggle input { accent-color: var(--blue); }
.mfa-policy-readonly { cursor: default; opacity: .72; }
.narrow-panel { max-width: 820px; }
.card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.role-card h2 { margin-top: 7px; }
.role-card p { color: var(--muted); }
.tiny-badge { padding: 3px 7px; background: #eef3fa; color: #52719a; font-size: 9px; margin-left: 6px; }
.permission-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.permission-chips span { background: #f0f4f9; border: 1px solid #e0e7f0; color: #5d6d83; border-radius: 999px; padding: 3px 7px; font-size: 9px; }
.table-panel { padding: 0; overflow: hidden; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 12px; }
th { text-align: left; color: #718097; background: #f7f9fc; text-transform: uppercase; letter-spacing: .05em; font-size: 9px; padding: 12px 14px; border-bottom: 1px solid var(--line); }
td { padding: 12px 14px; border-bottom: 1px solid #e9edf3; vertical-align: top; }
tbody tr:hover { background: #fbfcfe; }
.cell-subtext { display: block; color: var(--muted); margin-top: 3px; }
.status-badge, .status-select {
  --status-bg: #e2e8f0;
  --status-text: #1e293b;
  --status-border: #64748b;
  background: var(--status-bg) !important;
  color: var(--status-text) !important;
  border: 1px solid var(--status-border) !important;
  font-weight: 800;
}
.status-badge { display: inline-flex; align-items: center; border-radius: 999px; padding: 5px 10px; font-size: 11px; line-height: 1.2; letter-spacing: .02em; white-space: nowrap; }
.status-select { border-width: 2px !important; }
.status-draft, .status-neutral, .status-not-assessed {
  --status-bg: #e2e8f0; --status-text: #1e293b; --status-border: #64748b;
}
.status-open, .status-open-assessment, .status-in-progress, .status-submitted {
  --status-bg: #dbeafe; --status-text: #1e3a8a; --status-border: #2563eb;
}
.status-under-review, .status-partial, .status-pending {
  --status-bg: #fef3c7; --status-text: #78350f; --status-border: #d97706;
}
.status-valid, .status-effective, .status-approved, .status-completed,
.status-active, .status-implemented, .status-assessed, .status-reviewed {
  --status-bg: #dcfce7; --status-text: #14532d; --status-border: #16a34a;
}
.status-danger, .status-rejected, .status-failed, .status-overdue,
.status-expired, .status-suspended, .status-not-implemented {
  --status-bg: #fee2e2; --status-text: #7f1d1d; --status-border: #dc2626;
}
.status-muted, .status-inactive, .status-archived, .status-cancelled,
.status-removed, .status-not-applicable, .status-offboarded {
  --status-bg: #e5e7eb; --status-text: #374151; --status-border: #6b7280;
}
.priority-badge { display: inline-flex; border-radius: 999px; padding: 4px 8px; font-size: 9px; font-weight: 850; letter-spacing: .04em; }
.priority-low { background: #edf2f7; color: #64748b; }
.priority-medium { background: #eaf2ff; color: #285ca8; }
.priority-high { background: #fff2d8; color: #a05f00; }
.priority-critical { background: #fde6e6; color: #a72d2d; }
.record-item { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.record-item:last-child { border-bottom: 0; }
.record-item > div { display: flex; flex-direction: column; align-items: flex-start; }
.record-title-link { display: grid; gap: 3px; text-decoration: none; color: inherit; }
.record-title-link strong, .record-title-link small { display: block; }
.record-item small { color: var(--muted); }
.record-item.clickable { color: var(--ink); padding-left: 6px; padding-right: 6px; border-radius: 8px; }
.record-item.clickable:hover { background: #f6f8fc; }
.detail-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 18px; }
.detail-strip div { background: white; border: 1px solid var(--line); border-radius: 12px; padding: 14px; box-shadow: var(--shadow); }
.detail-strip span { display: block; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.detail-strip strong { display: block; margin-top: 4px; }
.timeline article { display: grid; grid-template-columns: 18px 1fr; gap: 10px; position: relative; padding-bottom: 20px; }
.timeline article:before { content: ""; position: absolute; left: 5px; top: 12px; bottom: 0; width: 1px; background: var(--line); }
.timeline article:last-child:before { display: none; }
.timeline-marker { width: 11px; height: 11px; border-radius: 50%; background: var(--blue); margin-top: 5px; z-index: 1; }
.timeline p { margin: 3px 0; color: var(--muted); }
.timeline small { color: var(--muted); }
details { margin-top: 8px; }
summary { cursor: pointer; color: var(--blue); font-size: 12px; }
pre { white-space: pre-wrap; background: #0f1d31; color: #dce8f8; border-radius: 9px; padding: 12px; overflow: auto; font-size: 11px; }
.danger-zone { margin-top: 18px; padding: 18px; border: 1px solid #efb6b6; background: #fff7f7; border-radius: 14px; display: flex; align-items: center; justify-content: space-between; }
.danger-zone h2 { color: #9c3232; margin: 0; }
.danger-zone p { margin: 3px 0 0; color: #7b5555; }
.empty-state { color: var(--muted); padding: 18px 4px; }
.error-page { min-height: 60vh; display: grid; place-items: center; align-content: center; text-align: center; }
.error-page > span { font-size: 84px; font-weight: 900; color: #d9e1ec; }
.error-page h1 { margin: 0; }
.error-page p { color: var(--muted); max-width: 620px; }
.login-page { min-height: 100vh; display: grid; grid-template-columns: 1.15fr .85fr; }
.login-brand-panel { background: radial-gradient(circle at 15% 20%, #2f68aa 0, #17395f 42%, #0b172a 100%); color: white; padding: 70px; display: grid; align-items: center; }
.login-brand-content { max-width: 650px; }
.login-brand-content h1 { font-size: clamp(38px, 5vw, 64px); line-height: 1.05; margin: 14px 0; }
.login-lead { color: rgba(255,255,255,.72); font-size: 18px; max-width: 560px; }
.login-brand-content .eyebrow { color: #8fb8ec; margin-top: 24px; }
.login-features { display: grid; gap: 16px; margin-top: 45px; }
.login-features div { display: grid; grid-template-columns: 42px 1fr; column-gap: 13px; align-items: start; }
.login-features span { grid-row: span 2; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: rgba(255,255,255,.1); color: #9bc1ef; font-weight: 800; }
.login-features small { color: rgba(255,255,255,.62); }
.login-form-panel { display: grid; place-items: center; padding: 35px; background: #f6f8fb; }
.login-box { width: min(430px, 100%); background: white; border: 1px solid var(--line); border-radius: 20px; padding: 34px; box-shadow: 0 24px 60px rgba(19,39,68,.12); position: relative; }
.login-box h2 { font-size: 29px; margin: 0 0 4px; }
.login-box .muted, .login-note { color: var(--muted); }
.login-note { margin-top: 20px; font-size: 11px; border-top: 1px solid var(--line); padding-top: 15px; }
.language-switch { position: absolute; top: 20px; right: 20px; display: flex; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.language-switch a { padding: 5px 8px; color: var(--muted); font-size: 10px; font-weight: 800; }
.language-switch a.selected { background: #e9f0fc; color: var(--blue); }
@media (max-width: 1250px) {
  .module-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kpi-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .permission-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .topbar { padding: 0 16px; }
  .profile-text, .environment-badge { display: none; }
  .app-shell { grid-template-columns: 1fr; }
  .sidebar { display: none; }
  .content, .content.content-full { grid-column: 1; padding: 18px; }
  .hero { align-items: flex-start; flex-direction: column; }
  .module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .two-column-grid, .two-column-grid.wide-left { grid-template-columns: 1fr; }
  .system-facts { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .card-grid { grid-template-columns: 1fr 1fr; }
  .login-page { grid-template-columns: 1fr; }
  .login-brand-panel { display: none; }
}
@media (max-width: 640px) {
  .brand small { display: none; }
  .top-actions { gap: 7px; }
  .module-grid, .kpi-grid, .card-grid, .form-grid, .checkbox-grid, .permission-grid, .detail-strip, .system-facts { grid-template-columns: 1fr; }
  .page-heading, .section-heading { align-items: flex-start; flex-direction: column; }
  .content, .content.content-full { padding: 13px; }
  .hero { padding: 23px; }
  .login-form-panel { padding: 16px; }
  .login-box { padding: 26px 20px; }
}
.role-preset-description { margin-top: 10px; border: 1px solid var(--line); border-radius: 10px; background: #f7f9fc; padding: 12px; }
.role-preset-description p { margin: 5px 0; color: var(--muted); }
.role-preset-description code { display: inline-block; margin: 3px 3px 0 0; font-size: 9px; }
.clean-list { padding-left: 1.2rem; line-height: 1.8; }
.mfa-qr-layout { display: grid; grid-template-columns: minmax(250px,280px) 1fr; gap: 24px; align-items: center; margin-bottom: 20px; }
.mfa-qr-card { display: grid; justify-items: center; gap: 8px; padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2); text-align: center; }
.mfa-qr-card img { display: block; width: min(260px,100%); height: auto; aspect-ratio: 1; padding: 8px; border: 1px solid #d7e0eb; border-radius: 10px; background: #fff; }
.mfa-qr-card strong { color: var(--navy); font-size: 12px; }
.mfa-qr-card small { color: var(--muted); font-size: 9px; }
@media (max-width: 720px) { .mfa-qr-layout { grid-template-columns: 1fr; } .mfa-qr-card { max-width: 320px; margin-inline: auto; } }
.tenant-switcher select{max-width:260px;background:#fff;border:1px solid #d7dde8;border-radius:8px;padding:.55rem .75rem;font-weight:600;color:#21304a}.secondary-button.disabled{opacity:.55;pointer-events:none}.module-card .secondary-button{display:inline-flex;justify-content:center}.alert strong+span{margin-left:.35rem}

/* Module 8 · Audit */
.audit-workspace-card.audit-workspace-live { color: inherit; text-decoration: none; }
.audit-workspace-card.audit-workspace-live:hover { border-color: #8caee3; box-shadow: 0 14px 38px rgba(28,64,112,.12); transform: translateY(-1px); }
.assurance-kpis { margin-bottom: 18px; }
.assurance-stack { display: grid; gap: 18px; align-content: start; }
.process-bar { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 0; margin: 0 0 18px; border: 1px solid var(--line); border-radius: 14px; background: white; overflow: hidden; box-shadow: var(--shadow); }
.process-bar > div { position: relative; min-height: 72px; padding: 14px 10px; display: grid; align-content: center; justify-items: center; gap: 5px; color: #77849a; border-right: 1px solid var(--line); text-align: center; }
.process-bar > div:last-child { border-right: 0; }
.process-bar > div:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: #dbe3ed; }
.process-bar span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #edf1f6; font-size: 10px; font-weight: 900; }
.process-bar strong { font-size: 10px; letter-spacing: .03em; }
.process-bar .complete { color: #1d6a49; background: #f6fcf9; }
.process-bar .complete span { background: #d8f2e5; color: #176944; }
.process-bar .complete:after { background: #25a36a; }
.process-bar .current { color: #173f77; background: #f3f7fd; }
.process-bar .current span { background: #285fa8; color: #fff; box-shadow: 0 0 0 4px #dce8f8; }
.process-bar .current:after { background: #285fa8; }
.assurance-transition { display: grid; grid-template-columns: minmax(230px,.65fr) minmax(380px,1.35fr); gap: 24px; margin-bottom: 18px; align-items: start; }
.assurance-transition h2 { margin-top: 0; }
.assurance-transition p { color: var(--muted); }
.assurance-transition-form textarea { min-height: 70px; }
.assurance-work-item { display: grid; grid-template-columns: 1fr minmax(230px,.6fr); gap: 18px; padding: 15px 0; border-bottom: 1px solid var(--line); }
.assurance-work-item strong { display: block; margin: 7px 0 3px; }
.assurance-work-item p { margin: 0 0 3px; color: #536277; }
.assurance-work-item small { color: var(--muted); }
.compact-work-form { gap: 7px; align-content: center; }
.finding-card { border: 1px solid var(--line); border-left-width: 5px; border-radius: 12px; margin-top: 13px; padding: 15px; background: #fff; }
.finding-card.severity-low { border-left-color: #8795aa; }
.finding-card.severity-medium { border-left-color: #2870c7; }
.finding-card.severity-high { border-left-color: #d48a13; }
.finding-card.severity-critical { border-left-color: #c93e3e; }
.finding-card-head { display: flex; justify-content: space-between; gap: 15px; align-items: flex-start; }
.finding-card-head > div { display: grid; grid-template-columns: auto 1fr; column-gap: 9px; align-items: center; }
.finding-card-head small { grid-column: 2; color: var(--muted); margin-top: 3px; }
.finding-body { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 18px; margin-top: 12px; padding: 12px; background: #f8fafc; border-radius: 9px; }
.finding-body p { margin: 0; color: #4c5a6e; font-size: 11px; }
.finding-links { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.finding-links a { background: #eef4fc; border: 1px solid #dce8f8; border-radius: 999px; padding: 4px 8px; font-size: 9px; }
.finding-controls { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 10px; margin-top: 12px; border-top: 1px solid var(--line); padding-top: 11px; }
.finding-controls details { min-width: min(100%,420px); margin: 0; }
.segmented-control { display: inline-flex; gap: 3px; padding: 4px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); box-shadow: 0 5px 16px rgba(21,32,51,.04); }
.segmented-control a { padding: 8px 12px; border-radius: 8px; color: var(--muted); font-size: 11px; font-weight: 800; }
.segmented-control a.active { color: #1b52bd; background: #e7efff; }
.supporting-text { color: var(--muted); font-size: 12px; }
.audit-component-item { padding: 4px 0 13px; border-bottom: 1px solid var(--line); }
.audit-component-item:last-of-type { border-bottom: 0; }
.audit-component-item .record-item { border-bottom: 0; }
.workpaper-uploader { margin-top: 9px; }
.workpaper-uploader form { max-width: 640px; padding: 13px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-2); }
.attachment-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.attachment-list.compact { grid-template-columns: 1fr; margin-top: 9px; }
.attachment-card { min-width: 0; display: grid; grid-template-columns: 34px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); color: var(--ink); }
.attachment-card:hover { color: var(--ink); border-color: #aec2dc; background: #f2f6fc; }
.attachment-card > span:nth-child(2) { min-width: 0; display: grid; }
.attachment-card strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.attachment-card small { overflow-wrap: anywhere; color: var(--muted); font-size: 9px; }
.attachment-card b { color: var(--blue); font-size: 14px; }
.attachment-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: #e7effb; color: #416fa7; }
.rfi-workspace-link { margin: 0; border-left-color: var(--blue); }
.workspace-count { display: grid; place-items: center; flex: 0 0 52px; width: 52px; height: 52px; border-radius: 50%; background: #e7efff; color: #1b52bd; font-size: 20px; font-weight: 900; }
.rfi-request-copy, .rfi-response-copy { margin: 0 0 14px; padding: 14px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-2); color: #4d5b70; }
.rfi-request-copy p, .rfi-response-copy p { margin: 0; white-space: pre-wrap; }
.rfi-primary-action { display: grid; gap: 10px; margin-top: 16px; padding-top: 15px; border-top: 1px solid var(--line); }
.rfi-primary-action label { display: grid; gap: 6px; color: #46536a; font-size: 11px; font-weight: 730; }
.rfi-primary-action button { justify-self: start; }
.rfi-save-button { min-height: 42px; padding-inline: 18px; box-shadow: 0 5px 13px rgba(200,63,63,.2); }
.rfi-save-materials-warning { align-items: flex-start; border-left: 4px solid #c83f3f; }
.rfi-save-materials-warning[hidden] { display: none; }
.framework-license-table { min-width: 1180px; }
.framework-license-form { display: grid; grid-template-columns: repeat(3, minmax(150px, 1fr)); gap: 10px; align-items: end; min-width: 610px; }
.framework-license-form label { display: grid; gap: 5px; font-size: .76rem; color: var(--muted); }
.framework-license-form input { min-width: 0; }
.framework-license-form button { grid-column: 1 / -1; justify-self: start; }
.cell-title { display: block; margin-top: 5px; }
.license-dates-readonly { display: flex; gap: 18px; margin: 0; }
.license-dates-readonly div { display: grid; gap: 2px; }
.license-dates-readonly dt { color: var(--muted); font-size: .72rem; }
.license-dates-readonly dd { margin: 0; font-weight: 700; }
.license-expired-note { color: #a22f2f; max-width: 230px; }
.smtp-preset { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2); }
.smtp-preset div { display: grid; gap: 2px; }
.smtp-preset small { color: var(--muted); }
@media (max-width: 900px) {
  .framework-license-form { grid-template-columns: 1fr; min-width: 250px; }
  .framework-license-form button { grid-column: auto; }
  .license-dates-readonly { flex-direction: column; gap: 7px; }
}
.rfi-review-panel { border-top: 4px solid var(--blue); }
.rfi-review-panel h2 { margin-top: 0; }
.rfi-review-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.rfi-review-actions form { display: grid; gap: 8px; align-content: start; padding: 12px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-2); }
.rfi-review-actions textarea { min-height: 72px; }
.rfi-timeline { display: grid; }
.rfi-timeline article { position: relative; display: grid; grid-template-columns: 14px minmax(0,1fr); gap: 9px; padding-bottom: 16px; }
.rfi-timeline article::before { content: ""; position: absolute; left: 5px; top: 11px; bottom: 0; width: 1px; background: var(--line); }
.rfi-timeline article:last-child::before { display: none; }
.timeline-dot { position: relative; z-index: 1; width: 11px; height: 11px; margin-top: 4px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 3px #e5eefc; }
.rfi-timeline strong, .rfi-timeline small { display: block; }
.rfi-timeline small { color: var(--muted); font-size: 9px; }
.rfi-timeline p { margin: 5px 0; color: var(--muted); font-size: 10px; }
.rfi-timeline blockquote { margin: 7px 0 0; padding: 8px 10px; border-left: 3px solid #a9c1df; border-radius: 0 7px 7px 0; background: var(--surface-2); color: #4c5c72; font-size: 10px; }
.status-withdrawn { --status-bg: #e5e7eb; --status-text: #374151; --status-border: #6b7280; }
.audit-report { max-width: 1050px; margin: auto; padding: 54px 64px; background: white; border: 1px solid var(--line); border-radius: 4px; box-shadow: var(--shadow); color: #1e2a39; }
.audit-report > header { border-bottom: 4px solid #1f548f; padding-bottom: 24px; margin-bottom: 24px; }
.audit-report > header span { color: #55718f; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 800; }
.audit-report > header h1 { margin: 10px 0 3px; font-size: 30px; }
.audit-report > header p { color: var(--muted); margin: 0; }
.audit-report section { margin-top: 28px; }
.audit-report h2 { color: #1d4778; border-bottom: 1px solid #d9e2ee; padding-bottom: 7px; }
.report-meta { display: grid; grid-template-columns: repeat(4,1fr); gap: 9px; }
.report-meta div { background: #f3f6fa; padding: 12px; border-radius: 7px; }
.report-meta span { display: block; color: var(--muted); font-size: 9px; text-transform: uppercase; }
.report-opinion { display: inline-flex; padding: 8px 12px; border: 2px solid #316ead; border-radius: 5px; color: #1b4d82; font-weight: 900; text-transform: uppercase; }
.report-finding { border: 1px solid #dce3ec; border-left: 6px solid #6c7d92; padding: 15px 18px; margin: 13px 0; page-break-inside: avoid; }
.report-finding.severity-high { border-left-color: #d48a13; }
.report-finding.severity-critical { border-left-color: #c93e3e; }
.report-finding h3 { margin: 0 0 4px; }
.report-finding p { margin: 5px 0; font-size: 11px; }
.audit-report footer { display: flex; justify-content: space-between; border-top: 1px solid #d9e2ee; padding-top: 16px; margin-top: 34px; color: var(--muted); font-size: 9px; }
@media (max-width: 980px) {
  .process-bar { grid-template-columns: repeat(3,1fr); }
  .process-bar > div:nth-child(3) { border-right: 0; }
  .assurance-transition, .assurance-work-item { grid-template-columns: 1fr; }
  .finding-body, .report-meta { grid-template-columns: repeat(2,1fr); }
  .rfi-review-actions { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .process-bar { grid-template-columns: repeat(2,1fr); }
  .finding-body, .report-meta { grid-template-columns: 1fr; }
  .audit-report { padding: 24px 18px; }
  .attachment-list { grid-template-columns: 1fr; }
  .rfi-workspace-link { align-items: flex-start; flex-direction: column; }
  .workspace-count { width: 42px; height: 42px; flex-basis: 42px; font-size: 17px; }
  .segmented-control { width: 100%; }
  .segmented-control a { flex: 1; text-align: center; }
}

/* Module 6 follows the platform design system */
.portal-body { min-height: 100vh; background: var(--bg); color: var(--ink); }
.portal-topbar { position: sticky; top: 0; z-index: 50; min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 10px 28px; background: linear-gradient(100deg,var(--navy),var(--navy-2)); color: white; box-shadow: 0 6px 18px rgba(4,12,24,.18); }
.portal-brand { display: flex; align-items: center; gap: 12px; color: white; }
.portal-brand:hover { color: white; }
.portal-brand > span:last-child { display: flex; flex-direction: column; }
.portal-brand small { color: rgba(255,255,255,.62); font-size: 12px; font-weight: 500; }
.portal-account { display: flex; align-items: center; gap: 14px; }
.portal-account a, .portal-account > span { color: rgba(255,255,255,.78); font-size: 12px; font-weight: 650; }
.portal-account a:hover { color: white; }
.portal-account form { margin: 0; }
.portal-main { width: 100%; max-width: none; margin: 0; padding: 28px; }
.portal-welcome { margin: 0; }
.portal-welcome h1 { margin: 2px 0 8px; font-size: clamp(28px,3vw,42px); }
.portal-welcome p { max-width: 780px; }
.portal-count { display: grid; place-items: center; min-width: 132px; padding: 18px; border: 1px solid rgba(255,255,255,.18); border-radius: 14px; background: rgba(255,255,255,.08); }
.portal-count strong { font-size: 34px; }
.portal-count span { color: rgba(255,255,255,.7); font-size: 11px; }
.portal-filterbar { display: grid; grid-template-columns: minmax(220px,2fr) repeat(4,minmax(125px,1fr)) auto; gap: 12px; align-items: end; margin: 18px 0 28px; padding: 18px; }
.portal-filterbar label { display: grid; gap: 6px; color: #46536a; font-size: 10px; font-weight: 730; }
.portal-filterbar label > span { color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.portal-filterbar .primary-button { min-height: 42px; }
.portal-gallery-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.portal-gallery-heading h2 { margin: 2px 0 0; font-size: 25px; }
.view-switch { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: 0 4px 12px rgba(21,32,51,.04); }
.view-switch a { display: flex; gap: 6px; align-items: center; padding: 8px 12px; border-radius: 7px; color: var(--muted); font-size: 10px; font-weight: 800; }
.view-switch a.active { background: #e7efff; color: #1b52bd; }
.document-gallery { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.document-tile { padding: 0; overflow: hidden; transition: transform .16s ease,box-shadow .16s ease,border-color .16s ease; }
.document-tile:hover { transform: translateY(-2px); border-color: #a9bdd7; box-shadow: var(--shadow-hover); }
.document-preview { position: relative; display: block; height: 330px; overflow: hidden; background: #e9eef5; border-bottom: 1px solid var(--line); }
.document-preview iframe { width: 134%; height: 134%; border: 0; transform: scale(.75); transform-origin: top left; pointer-events: none; background: white; }
.preview-shield { position: absolute; inset: 0; }
.pdf-corner { position: absolute; top: 12px; right: 12px; padding: 5px 8px; border-radius: 7px; background: var(--red); color: white; font-size: 9px; font-weight: 900; box-shadow: 0 4px 12px rgba(160,35,35,.2); }
.document-tile-body { display: flex; flex-direction: column; min-height: 225px; padding: 18px; }
.document-category { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--blue); font-size: 9px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.document-tile h2 { min-height: 48px; margin: 8px 0 5px; font-size: 17px; line-height: 1.4; }
.document-tile h2 a { color: var(--ink); }
.document-tile p { min-height: 32px; margin: 0 0 12px; color: var(--muted); font-size: 11px; }
.document-tile-meta { display: flex; justify-content: space-between; gap: 10px; margin: auto 0 14px; padding-top: 11px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.document-tile .secondary-button { align-self: flex-start; }
.document-gallery-list { grid-template-columns: 1fr; }
.document-gallery-list .document-tile { display: grid; grid-template-columns: minmax(190px,240px) 1fr; }
.document-gallery-list .document-preview { height: 245px; border: 0; border-right: 1px solid var(--line); }
.document-gallery-list .document-tile-body { min-height: 245px; }
.document-gallery-list .document-tile h2, .document-gallery-list .document-tile p { min-height: 0; }
.published-empty { grid-column: 1/-1; padding: 38px; background: var(--surface); border: 1px dashed #bdc9d8; border-radius: var(--radius); text-align: center; }
.portal-document-toolbar { margin-bottom: 16px; }
.portal-document-toolbar h1 { margin: 4px 0; font-size: clamp(24px,3vw,34px); }
.portal-document-toolbar p { margin: 0; color: var(--muted); }
.portal-back { display: inline-block; margin-bottom: 11px; color: var(--blue); font-size: 11px; font-weight: 800; }
.portal-document-actions { display: flex; gap: 8px; }
.portal-document-viewer { height: calc(100vh - 240px); min-height: 620px; padding: 0; overflow: hidden; background: #4a5360; }
.portal-document-viewer iframe { width: 100%; height: 100%; border: 0; }
.portal-document-footer { display: flex; justify-content: space-between; gap: 20px; align-items: center; margin-top: 14px; padding: 16px; }
.portal-document-facts { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; flex: 1; }
.portal-document-facts span { display: grid; gap: 3px; padding: 10px; border-radius: 9px; background: var(--surface-2); }
.portal-document-facts small { color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.portal-document-facts strong { font-size: 10px; }
@media (max-width: 1180px) { .document-gallery { grid-template-columns: repeat(2,1fr); } .portal-filterbar { grid-template-columns: repeat(3,1fr); } .portal-search { grid-column: span 2; } }
@media (max-width: 820px) { .portal-account > span { display:none; } .portal-topbar { padding-inline:18px; } .portal-main { padding:18px; } .portal-document-toolbar, .portal-document-footer { align-items:stretch; flex-direction:column; } .portal-document-facts { grid-template-columns:repeat(2,1fr); } }
@media (max-width: 560px) { .portal-topbar { align-items:flex-start; flex-direction:column; } .portal-account { width:100%; justify-content:space-between; flex-wrap:wrap; } .portal-welcome { align-items:flex-start; flex-direction:column; } .portal-filterbar,.document-gallery { grid-template-columns:1fr; } .portal-search { grid-column:auto; } .document-gallery-list .document-tile { grid-template-columns:1fr; } .document-gallery-list .document-preview { border-right:0; border-bottom:1px solid var(--line); } .portal-document-facts { grid-template-columns:1fr; } }
@media print {
  .topbar, .sidebar, .print-hide, .alert { display: none !important; }
  .app-shell, .content { display: block; padding: 0; background: white; }
  .audit-report { max-width: none; border: 0; box-shadow: none; padding: 0; }
}

/* Module 7 follows the platform design system */
.reporting-hero { margin-bottom: 18px; }
.reporting-hero h1 { margin: 2px 0 8px; font-size: clamp(28px,3vw,42px); }
.reporting-hero-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.report-audience-tabs { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 18px; padding: 5px; width: fit-content; max-width: 100%; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: 0 5px 16px rgba(21,32,51,.04); }
.report-audience-tabs a { padding: 8px 13px; border-radius: 8px; color: #526179; font-size: 11px; font-weight: 800; }
.report-audience-tabs a:hover { background: #f0f4fa; color: var(--navy); }
.report-audience-tabs a.active { background: #e7efff; color: #1b52bd; }
.report-visual-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)) minmax(280px,1.35fr); gap: 16px; margin-bottom: 18px; }
.score-ring-card { display: flex; align-items: center; gap: 14px; min-height: 112px; padding: 18px; }
.score-ring { --score:0; position: relative; display: grid; place-items: center; width: 70px; height: 70px; flex: 0 0 70px; border-radius: 50%; background: conic-gradient(var(--blue) calc(var(--score) * 1%),#e6edf4 0); }
.score-ring::before { content: ""; position: absolute; inset: 7px; border-radius: 50%; background: var(--surface); }
.score-ring span { position: relative; z-index: 1; font-size: 13px; font-weight: 900; }
.score-ring-card small { display: block; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.score-ring-card strong { display: block; margin-top: 5px; font-size: 12px; }
.report-attention-card { display: grid; grid-template-columns: 1.1fr repeat(3,minmax(64px,.7fr)); align-items: center; gap: 10px; min-height: 112px; padding: 18px; border-top: 4px solid var(--red); }
.report-attention-card > span { color: #7f2830; font-size: 11px; font-weight: 850; text-transform: uppercase; letter-spacing: .05em; }
.report-attention-card div { display: grid; justify-items: center; padding: 9px; border: 1px solid #f0dada; border-radius: 9px; background: #fff7f7; }
.report-attention-card strong { color: var(--red); font-size: 22px; }
.report-attention-card small { color: #7b5555; font-size: 8px; text-align: center; }
.reporting-kpis { grid-template-columns: repeat(4,minmax(0,1fr)); margin-bottom: 18px; }
.report-kpi { position: relative; display: grid; align-content: start; min-height: 132px; color: inherit; text-decoration: none; border-left-width: 1px; border-top: 4px solid #9aa8ba; }
.report-kpi.success { border-top-color: var(--green); }
.report-kpi.warning { border-top-color: var(--amber); }
.report-kpi.danger { border-top-color: var(--red); }
.report-kpi span { min-height: 36px; }
.report-kpi small { display: block; margin-top: auto; padding-top: 8px; color: #69809a; font-size: 9px; }
.report-kpi:hover { transform: translateY(-2px); border-color: #9eb6d3; box-shadow: var(--shadow-hover); }
.trend-table { display: grid; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.trend-row { display: grid; grid-template-columns: 100px repeat(4,minmax(100px,1fr)); min-height: 48px; align-items: center; border-bottom: 1px solid var(--line); }
.trend-row:last-child { border-bottom: 0; }
.trend-row > * { padding: 8px 10px; }
.trend-head { background: var(--surface-2); color: #65748a; font-size: 9px; font-weight: 850; text-transform: uppercase; }
.trend-row > span { position: relative; display: grid; gap: 4px; }
.trend-row span b { font-size: 11px; z-index: 1; }
.trend-row span i { display: block; width: var(--trend-width); height: 4px; border-radius: 999px; background: linear-gradient(90deg,var(--blue),#76a4dc); }
.report-coverage-list { display: grid; gap: 9px; }
.report-coverage-list div { display: grid; grid-template-columns: 10px 1fr; gap: 9px; align-items: center; padding: 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); }
.report-run-banner { display: grid; grid-template-columns: 1fr 1fr 2fr; gap: 10px; margin-bottom: 18px; }
.report-run-banner div { border: 1px solid var(--line); border-radius: 11px; padding: 13px; background: var(--surface); box-shadow: var(--shadow); }
.report-run-banner span { display: block; color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .06em; }
.report-run-banner strong { display: block; margin-top: 4px; overflow-wrap: anywhere; }
@media (max-width: 980px) {
  .report-visual-summary { grid-template-columns:repeat(2,1fr); }
  .reporting-kpis { grid-template-columns: repeat(2,1fr); }
  .trend-table { overflow-x: auto; }
  .trend-row { min-width: 720px; }
}
@media (max-width: 640px) {
  .reporting-hero { align-items:flex-start; flex-direction:column; }
  .report-visual-summary, .reporting-kpis, .report-run-banner { grid-template-columns: 1fr; }
}

/* Shared confirmation card */
.acknowledged-badge { display: grid; justify-items: start; gap: 5px; padding: 14px; border: 1px solid #a9dfc3; border-radius: 10px; background: #effaf4; color: #176944; font-weight: 900; }
.acknowledged-badge small { color: #4e7b65; font-weight: 500; }
