:root {
  --ink: #172033;
  --ink-soft: #344054;
  --muted: #667085;
  --line: #e3e8ef;
  --canvas: #f5f7fb;
  --surface: #ffffff;
  --sidebar: #101828;
  --sidebar-soft: #1d2939;
  --brand: #1769aa;
  --brand-dark: #0f4f82;
  --brand-soft: #eaf4fb;
  --cyan: #0891b2;
  --success: #15803d;
  --success-soft: #ecfdf3;
  --warning: #b7791f;
  --warning-soft: #fffaeb;
  --danger: #b42318;
  --danger-soft: #fff1f0;
  --violet: #6941c6;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}

/* QualityFlow audit workspace */
.quality-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;width:100%}
.qa-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:20px;background:linear-gradient(135deg,#fff 0%,#eef8f7 100%)}
.timer-card{min-width:210px;padding:16px 20px;border-radius:14px;background:#102a43;color:#fff;text-align:right}.timer-card small,.timer-card strong,.timer-card span{display:block}.timer-card strong{font-size:25px;margin:5px 0}.timer-card .within-target{color:#6ee7b7}.timer-card .over-target{color:#fda4af}
.qa-checklist{display:grid;gap:12px}.qa-check-row{display:grid;grid-template-columns:minmax(260px,2fr) minmax(300px,1.4fr) minmax(220px,1fr) minmax(125px,.55fr);gap:14px;align-items:center;padding:16px;border:1px solid var(--line);border-radius:12px;background:#fbfdff}.qa-check-row small{display:block;color:var(--muted);margin-top:4px}.qa-radio td{padding-right:10px;white-space:nowrap}.score-field{margin:0}.check-list{max-height:240px;overflow:auto;padding:10px;border:1px solid var(--line);border-radius:10px}.check-list td{padding:5px}.inset-panel{margin-top:16px;padding:16px;border:1px solid var(--line);border-radius:12px;background:#f8fafc}.table-scroll{overflow-x:auto}.intelligence-panel{margin-top:20px;border-left:5px solid #0f766e}
.manager-review-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media(max-width:1100px){.quality-metrics{grid-template-columns:repeat(2,minmax(180px,1fr))}.qa-check-row{grid-template-columns:1fr 1fr}.qa-hero{align-items:flex-start}}
@media(max-width:650px){.quality-metrics,.qa-check-row{grid-template-columns:1fr}.qa-hero{display:block}.timer-card{margin-top:15px;text-align:left}}
@media(max-width:650px){.manager-review-meta{grid-template-columns:1fr}}

* { box-sizing: border-box; }
html { min-height: 100%; }
body { min-height: 100vh; margin: 0; background: var(--canvas); color: var(--ink); font-size: 14px; }
a { color: var(--brand); }
.app-frame, .app-layout { min-height: 100vh; }
.app-layout { display: grid; grid-template-columns: 252px minmax(0,1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; overflow-y: auto; display: flex; flex-direction: column; padding: 22px 16px 16px; background: linear-gradient(180deg,#101828 0%,#111d31 100%); color: #d0d5dd; box-shadow: 5px 0 24px rgba(16,24,40,.08); z-index: 5; }
.brand { display: flex; align-items: center; gap: 11px; padding: 3px 8px 20px; color: white; text-decoration: none; }
.brand-mark { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: linear-gradient(135deg,#38bdf8,#1769aa); color: white; font-weight: 800; font-size: 13px; box-shadow: 0 8px 18px rgba(56,189,248,.22); }
.brand-name { font-size: 21px; font-weight: 800; letter-spacing: -.6px; }
.brand-name span { color: #7dd3fc; }
.workspace-card { margin: 0 4px 18px; padding: 13px 14px; border: 1px solid rgba(255,255,255,.09); border-radius: 12px; background: rgba(255,255,255,.05); }
.workspace-card small, .workspace-card strong { display: block; }
.workspace-card small { color: #98a2b3; font-size: 10px; text-transform: uppercase; letter-spacing: .8px; }
.workspace-card strong { margin-top: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: white; font-size: 13px; }
.side-nav { display: flex; flex-direction: column; gap: 3px; }
.side-nav a { display: flex; align-items: center; gap: 11px; min-height: 42px; padding: 8px 10px; border-radius: 9px; color: #d0d5dd; text-decoration: none; font-weight: 600; }
.side-nav a:hover, .side-nav a:focus { background: var(--sidebar-soft); color: white; outline: none; }
.nav-heading { margin: 17px 10px 6px; color: #667085; font-size: 10px; font-weight: 800; letter-spacing: 1.1px; text-transform: uppercase; }
.nav-icon { display: inline-grid; place-items: center; flex: 0 0 27px; width: 27px; height: 27px; border-radius: 8px; background: rgba(255,255,255,.07); color: #7dd3fc; font-size: 11px; font-weight: 800; }
.nav-count { display: inline-grid; place-items: center; min-width: 22px; height: 22px; margin-left: auto; padding: 0 6px; border-radius: 99px; background: #e5484d; color: #fff; font-size: 10px; font-weight: 800; line-height: 1; box-shadow: 0 0 0 2px rgba(229,72,77,.14); }
.sidebar-foot { display: flex; align-items: center; gap: 8px; margin-top: auto; padding: 16px 10px 4px; color: #98a2b3; font-size: 11px; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: #12b76a; box-shadow: 0 0 0 4px rgba(18,183,106,.12); }
.app-content { min-width: 0; }
.topbar { position: sticky; top: 0; z-index: 4; min-height: 70px; padding: 0 30px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.96); backdrop-filter: blur(12px); }
.header-context span, .header-context strong { display: block; }
.header-label { margin-bottom: 2px; color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.header-context strong { font-size: 15px; }
.account { display: flex; align-items: center; gap: 10px; }
.notification-button { position: relative; display: inline-grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 10px; background: white; color: var(--ink-soft); text-decoration: none; }
.notification-button:hover { background: var(--brand-soft); color: var(--brand); }
.bell-shape { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.notification-count { position: absolute; top: -7px; right: -7px; min-width: 20px; height: 20px; padding: 0 5px; border: 2px solid white; border-radius: 99px; background: #e5484d; color: white; font-size: 10px; font-weight: 800; line-height: 16px; text-align: center; }
.user-avatar { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #dbeafe; color: var(--brand-dark); font-weight: 800; }
.account-name { max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.quiet-link, .quiet-action { color: var(--muted); font-size: 12px; }
.page-shell { width: min(1480px,100%); margin: 0 auto; padding: 32px 30px 64px; }
.page-title { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.page-title h1 { margin: 3px 0 6px; font-size: clamp(27px,3vw,36px); line-height: 1.15; letter-spacing: -1px; }
.page-title h2 { margin: 0; }
.eyebrow { color: var(--brand); font-size: 10px; font-weight: 800; letter-spacing: 1.3px; text-transform: uppercase; }
.lede, .muted { color: var(--muted); }
.lede { font-size: 15px; line-height: 1.55; }
.organization-chip { display: inline-flex; align-items: center; gap: 7px; margin-top: 12px; padding: 7px 11px; border: 1px solid #c7dff0; border-radius: 99px; background: var(--brand-soft); color: var(--brand-dark); font-size: 12px; }
.organization-chip span { color: var(--muted); }
.grid { display: grid; gap: 18px; }
.metrics, .metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; width:100%; }
.two-col { grid-template-columns: minmax(0,1.5fr) minmax(280px,1fr); }
.card { min-width: 0; padding: 21px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: 0 3px 14px rgba(16,24,40,.035); }
.card h2, .card h3 { margin-top: 0; }
.filter-card { padding: 17px 20px; }
.filter-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }
.filter-row h2 { margin: 2px 0 3px; font-size: 19px; }
.field { margin-bottom: 16px; }
.field.compact { min-width: 240px; margin-bottom: 0; }
.button.compact { padding: 7px 10px; white-space: nowrap; font-size: 11px; }
.field label { display: block; margin-bottom: 7px; color: var(--ink-soft); font-size: 12px; font-weight: 700; }
.input, select.input, textarea.input { width: 100%; min-height: 40px; padding: 9px 11px; border: 1px solid #cfd7e3; border-radius: 9px; background: white; color: var(--ink); font: inherit; }
.input:focus { border-color: #6aa8d6; outline: 3px solid rgba(23,105,170,.10); }
.period-selector { width: 190px; }
.period-controls { display: flex; align-items: flex-end; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.custom-date-range { display: none; align-items: flex-end; gap: 10px; }
.custom-date-range.is-visible { display: flex; }
.custom-date-range .field.compact { min-width: 155px; }
.period-apply { margin-bottom: 0; }
.actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.button, input[type=submit].button { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 9px 15px; border: 1px solid transparent; border-radius: 9px; background: var(--brand); color: white; cursor: pointer; font-size: 13px; font-weight: 750; text-decoration: none; box-shadow: 0 2px 5px rgba(23,105,170,.18); }
.button:hover { background: var(--brand-dark); }
.button.secondary { border-color: #cbd5e1; background: white; color: var(--ink-soft); box-shadow: none; }
.button.secondary:hover { border-color: #8fb8d4; background: #f8fbfd; color: var(--brand-dark); }
.button.danger { background: var(--danger); }
.button.small { min-height: 32px; padding: 6px 11px; font-size: 11px; }
.text-link { color: var(--brand); font-size: 12px; font-weight: 700; text-decoration: none; }
.alert { margin: 14px 0; padding: 12px 14px; border: 1px solid #abefc6; border-radius: 9px; background: var(--success-soft); color: #067647; }
.alert.error, .validation { color: var(--danger); }
.alert.error { border-color: #fecdca; background: var(--danger-soft); }
.selection-box { max-height: 220px; overflow: auto; padding: 10px 12px; border: 1px solid var(--line); border-radius: 9px; background: #fbfcfe; }
.selection-box label { display: inline; margin-left: 7px; font-weight: 500; }
.selection-box td { padding: 5px 2px; border: 0; }
.metric { position: relative; min-height: 142px; }
.metric .value { display: block; margin: 11px 0 5px; color: var(--ink); font-size: 29px; font-weight: 800; letter-spacing: -.7px; }
.metric .label { color: var(--muted); font-size: 12px; font-weight: 700; }
.metric-foot { color: var(--muted); font-size: 11px; }
.metric-icon { position: absolute; top: 18px; right: 18px; display: grid; place-items: center; width: 29px; height: 29px; border-radius: 9px; font-size: 10px; font-weight: 900; }
.metric-icon.blue { background: #eaf4fb; color: var(--brand); }.metric-icon.cyan { background: #ecfeff; color: var(--cyan); }.metric-icon.violet { background: #f4f3ff; color: var(--violet); }.metric-icon.green { background: var(--success-soft); color: var(--success); }.metric-icon.amber { background: var(--warning-soft); color: var(--warning); }.metric-icon.red { background: var(--danger-soft); color: var(--danger); }
.metric-link { display: block; color: inherit; text-decoration: none; transition: transform .16s ease,box-shadow .16s ease,border-color .16s ease; }
.metric-link:hover, .metric-link:focus { color: inherit; border-color: #9bc2dd; box-shadow: 0 12px 28px rgba(16,24,40,.09); transform: translateY(-2px); outline: none; }
.planning-hero { margin: 18px 0 28px; }
.plan-summary { display: grid; grid-template-columns: minmax(280px,1fr) minmax(520px,1.4fr); gap: 30px; align-items: center; padding: 25px; border: 1px solid #c8d9e7; border-left: 5px solid var(--brand); border-radius: 15px; background: linear-gradient(120deg,#f7fbfe,#fff); }
.plan-summary h2 { margin: 4px 0 7px; font-size: 25px; }
.plan-summary p { margin: 0; color: var(--ink-soft); line-height: 1.55; }
.plan-summary.status-critical { border-left-color: var(--danger); background: linear-gradient(120deg,#fff5f4,#fff); }.plan-summary.status-good { border-left-color: var(--success); background: linear-gradient(120deg,#f2fbf6,#fff); }.plan-summary.status-watch { border-left-color: var(--warning); background: linear-gradient(120deg,#fffaf0,#fff); }
.plan-stat-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.plan-stat { padding: 13px; border: 1px solid rgba(16,24,40,.08); border-radius: 11px; background: rgba(255,255,255,.78); color: inherit; text-decoration: none; }
.plan-stat span,.plan-stat strong,.plan-stat small { display: block; }.plan-stat span { color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }.plan-stat strong { margin: 5px 0 2px; font-size: 24px; }.plan-stat small { color: var(--muted); font-size: 10px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 29px 0 14px; }
.section-heading h2 { margin: 3px 0 0; font-size: 20px; }.section-heading.inside { margin: 0 0 15px; }
.risk-grid { grid-template-columns: repeat(5,minmax(0,1fr)); }
.risk-card { min-height: 112px; }.risk-card span,.risk-card strong,.risk-card small { display: block; }.risk-card span { color: var(--muted); font-size: 11px; font-weight: 700; }.risk-card strong { margin: 7px 0 3px; font-size: 27px; }.risk-card small { color: var(--muted); font-size: 10px; }.risk-card.warning { border-top: 3px solid #f59e0b; }.risk-card.danger { border-top: 3px solid #e5484d; }
.department-performance { margin-top: 28px; }.executive-table table { min-width: 1500px; }
.table-wrap { width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.report-table table { min-width: 1600px; }.assignment-table table { min-width: 1350px; }
table { width: 100%; border-collapse: separate; border-spacing: 0; }
th { padding: 10px 11px; border-bottom: 1px solid var(--line); background: #f8fafc; color: var(--muted); font-size: 10px; text-align: left; text-transform: uppercase; letter-spacing: .65px; white-space: nowrap; }
td { padding: 12px 11px; border-bottom: 1px solid #edf0f4; color: var(--ink-soft); vertical-align: top; }
tr:hover td { background: #fbfdff; }
.badge, .status-pill { display: inline-block; padding: 4px 8px; border-radius: 99px; background: var(--brand-soft); color: var(--brand-dark); font-size: 10px; font-weight: 800; }.badge.overdue { background: var(--danger-soft); color: var(--danger); }
.notification-list-card { padding: 0; overflow: hidden; }
.notification-row { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: 14px; align-items: center; padding: 17px 20px; border-bottom: 1px solid var(--line); }
.notification-row:last-child { border-bottom: 0; }.notification-row.is-read { opacity: .66; background: #fafafa; }.notification-row.is-unread { background: white; }
.notification-category-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: var(--brand-soft); color: var(--brand); font-size: 12px; font-weight: 900; }.notification-row.severity-critical .notification-category-icon,.status-pill.severity-critical { background: var(--danger-soft); color: var(--danger); }.notification-row.severity-warning .notification-category-icon,.status-pill.severity-warning { background: var(--warning-soft); color: var(--warning); }.notification-row.severity-success .notification-category-icon,.status-pill.severity-success { background: var(--success-soft); color: var(--success); }
.notification-row-title { display: flex; align-items: center; gap: 8px; }.notification-copy p { margin: 4px 0; color: var(--ink-soft); }.notification-copy small { color: var(--muted); }.notification-actions { display: flex; align-items: center; gap: 10px; }.empty-state { padding: 58px 20px; text-align: center; }.empty-state h2 { margin-bottom: 4px; }.empty-icon { display: grid; place-items: center; width: 44px; height: 44px; margin: 0 auto 12px; border-radius: 50%; background: var(--success-soft); color: var(--success); font-weight: 900; }
.definition-intro h2 { margin-bottom: 16px; }.definition-notes { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }.definition-notes div { padding: 13px; border-radius: 10px; background: #f8fafc; }.definition-notes strong,.definition-notes span { display: block; }.definition-notes strong { margin-bottom: 5px; font-size: 12px; }.definition-notes span { color: var(--muted); font-size: 11px; line-height: 1.5; }
.definition-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; }.definition-card { display: flex; flex-direction: column; min-height: 190px; }.definition-card h3 { margin-bottom: 8px; font-size: 16px; }.definition-card p { flex: 1; margin: 0 0 15px; color: var(--ink-soft); font-size: 12px; line-height: 1.6; }.definition-card code { display: block; padding: 10px 11px; border: 1px solid #dce6ef; border-radius: 8px; background: #f7fafc; color: var(--brand-dark); font-family: Consolas,"Courier New",monospace; font-size: 11px; line-height: 1.45; white-space: normal; }.definition-card.featured { border-top: 3px solid var(--brand); }
.report-range-fields { display: flex; align-items: flex-end; gap: 10px; }.report-range-fields .field { min-width: 170px; }.report-download-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }.report-download-card { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: 14px; align-items: center; min-height: 168px; }.report-download-card h3 { margin: 0 0 7px; font-size: 16px; }.report-download-card p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }.report-mark { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; font-size: 12px; font-weight: 900; }.report-mark.blue { background: var(--brand-soft); color: var(--brand); }.report-mark.cyan { background: #ecfeff; color: var(--cyan); }.report-mark.violet { background: #f4f3ff; color: var(--violet); }.report-mark.green { background: var(--success-soft); color: var(--success); }.report-mark.amber { background: var(--warning-soft); color: var(--warning); }.report-mark.red { background: var(--danger-soft); color: var(--danger); }.compact-reports .report-download-card { min-height: 145px; }
.profile-hero { display: grid; grid-template-columns: 64px minmax(0,1fr) auto; gap: 17px; align-items: center; }.profile-avatar { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 18px; background: linear-gradient(135deg,#dbeafe,#bae6fd); color: var(--brand-dark); font-size: 24px; font-weight: 900; }.profile-heading h2 { margin: 3px 0 4px; font-size: 24px; }.profile-heading p { margin: 0; color: var(--muted); }.status-pill.profile-active { background: var(--success-soft); color: var(--success); }.status-pill.profile-inactive { background: var(--danger-soft); color: var(--danger); }
.profile-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin-top: 14px; padding: 0; overflow: hidden; background: var(--line); }.profile-facts div { min-height: 78px; padding: 16px 18px; background: white; }.profile-facts span,.profile-facts strong { display: block; }.profile-facts span { margin-bottom: 6px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase; }.profile-facts strong { color: var(--ink-soft); font-size: 13px; }.compact-profile-facts { grid-template-columns: repeat(3,minmax(0,1fr)); margin: 14px 0 20px; border: 1px solid var(--line); border-radius: 11px; }.compact-profile-facts div { min-height: 68px; padding: 13px 15px; }
.profile-access-card p { margin: 14px 0 10px; color: var(--ink-soft); line-height: 1.6; }.role-list { display: flex; gap: 8px; flex-wrap: wrap; }.role-chip { display: inline-flex; padding: 7px 11px; border-radius: 99px; background: var(--brand-soft); color: var(--brand-dark); font-size: 11px; font-weight: 800; }.access-note { padding: 11px 13px; border-left: 3px solid var(--warning); background: var(--warning-soft); color: #7a5315; font-size: 11px; line-height: 1.5; }.profile-columns { display: grid; grid-template-columns: minmax(320px,.8fr) minmax(0,1.5fr); gap: 18px; margin-top: 22px; }.profile-routing-table table { min-width: 620px; }
.work-data { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--line); }.work-field { padding: 13px 15px; background: white; }.work-field b { display: block; margin-bottom: 5px; color: var(--muted); font-size: 10px; text-transform: uppercase; }.timer { font-size: 30px; font-weight: 800; font-variant-numeric: tabular-nums; }.timer-within-target { color: var(--success); }.timer-over-target { color: var(--danger); }
.auth-page { background: #fff; }
.auth-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(600px,1.25fr) minmax(440px,.75fr); }
.auth-story { position: relative; display: flex; align-items: center; padding: clamp(54px,7vw,105px); overflow: hidden; background: radial-gradient(circle at 88% 8%,rgba(34,211,238,.18),transparent 28%),radial-gradient(circle at 8% 92%,rgba(59,130,246,.16),transparent 30%),linear-gradient(145deg,#0b1528 0%,#102a43 52%,#0b5367 100%); color: white; }
.auth-story::before { position: absolute; top: -90px; right: -90px; width: 290px; height: 290px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; content: ""; box-shadow: 0 0 0 48px rgba(255,255,255,.025),0 0 0 96px rgba(255,255,255,.018); }
.auth-story::after { position: absolute; right: 8%; bottom: -65px; width: 210px; height: 210px; border-radius: 54px; background: rgba(8,145,178,.08); content: ""; transform: rotate(27deg); }
.auth-story-content { position: relative; z-index: 1; width: min(880px,100%); margin: auto; }
.auth-brandline { display: inline-flex; align-items: center; gap: 12px; margin-bottom: clamp(44px,6vh,72px); color: white; font-size: 22px; font-weight: 850; letter-spacing: -.6px; text-decoration: none; }
.auth-brandline > span:last-child > span { color: #67e8f9; }
.auth-logo-mark { display: inline-grid; place-items: center; width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.28); border-radius: 12px; background: linear-gradient(135deg,rgba(103,232,249,.28),rgba(255,255,255,.09)); color: #e6fbff; font-size: 12px; font-weight: 900; box-shadow: 0 10px 26px rgba(0,0,0,.18); }
.auth-eyebrow { color: #67e8f9; }
.auth-story h1 { max-width: 790px; margin: 16px 0 20px; font-size: clamp(42px,4.6vw,68px); line-height: 1.01; letter-spacing: -2.7px; }
.auth-story .auth-lede { max-width: 760px; margin: 0; color: #d8ebf4; font-size: clamp(16px,1.45vw,19px); line-height: 1.7; }
.auth-proof-strip { display: flex; flex-wrap: wrap; gap: 9px; margin: 28px 0; }
.auth-proof-strip > span { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 7px 11px; border: 1px solid rgba(255,255,255,.15); border-radius: 99px; background: rgba(255,255,255,.075); color: #e7f6fb; font-size: 11px; font-weight: 700; backdrop-filter: blur(8px); }
.auth-proof-strip b { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: #67e8f9; color: #0c3346; font-size: 8px; }
.auth-feature-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 25px; }
.auth-feature-card { display: grid; grid-template-columns: 39px minmax(0,1fr); gap: 13px; min-height: 145px; padding: 17px; border: 1px solid rgba(255,255,255,.12); border-radius: 14px; background: rgba(255,255,255,.065); backdrop-filter: blur(8px); }
.auth-feature-icon { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 11px; background: rgba(103,232,249,.15); color: #8bedf8; font-size: 10px; font-weight: 900; }
.auth-feature-card h2,.auth-process-step h2 { margin: 1px 0 6px; color: white; font-size: 14px; line-height: 1.35; }
.auth-feature-card p,.auth-process-step p { margin: 0; color: #bfd6e2; font-size: 12px; line-height: 1.55; }
.auth-difference { margin-top: 14px; padding: 18px 20px; border-left: 3px solid #67e8f9; border-radius: 0 12px 12px 0; background: rgba(4,20,35,.28); }
.auth-difference-label { display: block; margin-bottom: 6px; color: #67e8f9; font-size: 9px; font-weight: 900; letter-spacing: 1.1px; text-transform: uppercase; }
.auth-difference p { max-width: 760px; margin: 0; color: #e2f1f6; font-size: 13px; line-height: 1.6; }
.auth-trust-row { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 24px; color: #b8d3df; font-size: 10px; font-weight: 750; text-transform: uppercase; }
.auth-trust-row span { position: relative; padding-left: 16px; }
.auth-trust-row span::before { position: absolute; top: 3px; left: 0; width: 8px; height: 8px; border-radius: 50%; background: #34d399; content: ""; box-shadow: 0 0 0 3px rgba(52,211,153,.12); }
.auth-panel { display: flex; align-items: center; justify-content: center; padding: clamp(36px,5vw,76px); background: linear-gradient(180deg,#fff 0%,#f8fbfd 100%); }
.auth-form { width: min(470px,100%); }
.auth-form-rich { padding: 6px 0; }
.auth-form-brand { margin-bottom: 42px; color: #0d2d49; font-size: 24px; font-weight: 900; letter-spacing: -.7px; }
.auth-form-brand span { color: var(--cyan); }
.auth-form h2 { margin: 7px 0 8px; color: #10233d; font-size: clamp(28px,2.7vw,35px); line-height: 1.15; letter-spacing: -1px; }
.auth-form-intro { margin: 0 0 24px; line-height: 1.6; }
.auth-form .field label { color: #253b53; font-size: 11px; text-transform: uppercase; letter-spacing: .45px; }
.auth-form .input { min-height: 46px; border-color: #c8d6e3; background: #fff; }
.auth-form-benefits { display: flex; flex-wrap: wrap; gap: 8px; margin: -8px 0 24px; }
.auth-form-benefits > span { display: inline-flex; align-items: center; gap: 7px; padding: 7px 9px; border-radius: 8px; background: #eef7fb; color: #36566e; font-size: 10px; font-weight: 700; }
.auth-form-benefits b { display: grid; place-items: center; width: 19px; height: 19px; border-radius: 6px; background: #d7eef6; color: #087c97; font-size: 8px; }
.auth-primary-button { width: 100%; min-height: 46px !important; margin-top: 3px; background: linear-gradient(135deg,#1769aa,#087f99) !important; box-shadow: 0 8px 20px rgba(23,105,170,.18) !important; }
.auth-primary-button:hover { background: linear-gradient(135deg,#0f4f82,#066579) !important; }
.auth-form-cta { margin-top: 25px; padding: 18px; border: 1px solid #d9e7ef; border-radius: 13px; background: linear-gradient(135deg,#f2f9fc,#fff); }
.auth-form-cta strong { display: block; margin: 5px 0; color: #17324b; font-size: 14px; }
.auth-form-cta p { margin: 0 0 12px; color: var(--muted); font-size: 11px; line-height: 1.55; }
.auth-form-cta .button { min-height: 36px; font-size: 11px; }
.auth-security-line { margin: 18px 0 0; color: #7b8b9a; font-size: 9px; line-height: 1.6; text-align: center; text-transform: uppercase; letter-spacing: .4px; }
.field-help { display: block; margin-top: 5px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.auth-process { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 30px; }
.auth-process-step { display: grid; grid-template-columns: 38px minmax(0,1fr); gap: 13px; min-height: 130px; padding: 17px; border: 1px solid rgba(255,255,255,.12); border-radius: 14px; background: rgba(255,255,255,.065); }
.auth-step-number { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid rgba(103,232,249,.35); border-radius: 50%; color: #8bedf8; font-size: 13px; font-weight: 900; }
.auth-register-difference { margin-top: 20px; }
.auth-value-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 18px; }
.auth-value-list span { position: relative; padding-left: 17px; color: #e2f1f6; font-size: 11px; line-height: 1.5; }
.auth-value-list span::before { position: absolute; top: 5px; left: 1px; width: 7px; height: 7px; border-radius: 2px; background: #67e8f9; content: ""; transform: rotate(45deg); }
.auth-register-form { width: min(500px,100%); }
.auth-register-form .auth-form-brand { margin-bottom: 30px; }
.auth-trial-card { margin: 21px 0 24px; padding: 15px; border: 1px solid #b9e1d0; border-radius: 13px; background: linear-gradient(145deg,#effcf5,#fff); }
.auth-trial-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.auth-trial-heading strong { color: #175c3b; font-size: 12px; }
.auth-trial-heading span { padding: 5px 8px; border-radius: 99px; background: #d9f7e6; color: #087443; font-size: 9px; font-weight: 850; text-transform: uppercase; }
.auth-trial-facts { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1px; overflow: hidden; border: 1px solid #d8eee3; border-radius: 9px; background: #d8eee3; }
.auth-trial-facts span { min-height: 62px; padding: 9px; background: rgba(255,255,255,.9); color: #587166; font-size: 8px; font-weight: 750; line-height: 1.35; text-align: center; text-transform: uppercase; }
.auth-trial-facts b { display: block; margin-bottom: 3px; color: #147647; font-size: 17px; }
.auth-trial-card > p { margin: 10px 2px 0; color: #587166; font-size: 9px; line-height: 1.5; }
.auth-otp-panel { padding-top: 4px; }
.auth-otp-input { font-size: 22px !important; font-weight: 800 !important; letter-spacing: 8px; text-align: center; }
.auth-otp-actions .button { flex: 1 1 auto; }
.auth-change-details { min-height: 38px; padding: 8px 4px; border: 0; background: transparent; cursor: pointer; }
.auth-signin-link { margin: 14px 0 0; color: var(--muted); font-size: 11px; text-align: center; }
.auth-signin-link a { font-weight: 750; }

.subscription-page-title { align-items: center; }.launch-deal-pill { display: inline-flex; align-items: center; min-height: 38px; padding: 8px 14px; border: 1px solid #86efac; border-radius: 99px; background: var(--success-soft); color: var(--success); font-size: 12px; font-weight: 900; white-space: nowrap; }
.subscription-summary-card { display: grid; grid-template-columns: minmax(250px,.7fr) minmax(620px,1.7fr); gap: 30px; align-items: center; padding: 25px; border: 1px solid #b9d6ea; border-radius: 16px; background: linear-gradient(130deg,#f1f8fd 0%,#fff 62%); box-shadow: 0 8px 26px rgba(23,105,170,.07); }.subscription-summary-copy h2 { margin: 5px 0 7px; font-size: 25px; }.subscription-summary-copy p { margin: 0; color: var(--muted); line-height: 1.55; }.subscription-summary-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--line); }.subscription-summary-facts > div { min-height: 84px; padding: 15px; background: rgba(255,255,255,.94); }.subscription-summary-facts span,.subscription-summary-facts strong { display: block; }.subscription-summary-facts span { margin-bottom: 7px; color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }.subscription-summary-facts strong { color: var(--ink); font-size: 15px; }.subscription-status { display: inline-flex !important; width: max-content; padding: 5px 9px; border-radius: 99px; font-size: 11px !important; }.subscription-status.active { background: var(--success-soft); color: var(--success); }.subscription-status.trial { background: var(--brand-soft); color: var(--brand); }.subscription-status.attention { background: var(--warning-soft); color: var(--warning); }
.value-banner { display: grid; grid-template-columns: 50px minmax(0,1fr) auto; gap: 18px; align-items: center; margin: 22px 0; padding: 21px 24px; border: 1px solid #a7e3bd; border-radius: 15px; background: linear-gradient(110deg,#edfcf3,#fff); }.value-banner-mark { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--success); color: white; font-size: 19px; font-weight: 900; box-shadow: 0 8px 18px rgba(21,128,61,.18); }.value-banner h2 { margin: 3px 0 4px; font-size: 20px; }.value-banner p { margin: 0; color: var(--ink-soft); line-height: 1.55; }.value-saving { min-width: 150px; padding-left: 22px; border-left: 1px solid #b9e8c9; text-align: right; }.value-saving strong,.value-saving span { display: block; }.value-saving strong { color: var(--success); font-size: 35px; line-height: 1; }.value-saving span { margin-top: 5px; color: var(--muted); font-size: 10px; text-transform: uppercase; }
.pricing-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15px; align-items: stretch; }.pricing-card { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 22px; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: white; box-shadow: 0 5px 18px rgba(16,24,40,.045); }.pricing-card.trial-price { border-top: 3px solid var(--success); background: linear-gradient(180deg,#f2fff7,#fff 45%); }.pricing-card.featured-price { border: 2px solid var(--brand); box-shadow: 0 14px 30px rgba(23,105,170,.12); }.recommended-ribbon { position: absolute; top: 15px; right: -31px; width: 124px; padding: 6px; transform: rotate(38deg); background: var(--brand); color: white; font-size: 9px; font-weight: 900; text-align: center; text-transform: uppercase; }.pricing-kicker { color: var(--brand); font-size: 10px; font-weight: 900; letter-spacing: .9px; text-transform: uppercase; }.pricing-card h2 { margin: 6px 0 13px; font-size: 22px; }.pricing-card > p { min-height: 72px; margin: 12px 0; color: var(--muted); font-size: 12px; line-height: 1.55; }.price-line { display: flex; align-items: baseline; gap: 8px; min-height: 60px; }.price-line strong { font-size: 30px; letter-spacing: -.8px; }.price-line span { color: var(--muted); font-size: 11px; }.price-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }.price-pair > div { padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: #fbfdff; }.price-pair span,.price-pair s,.price-pair strong,.price-pair small { display: block; }.price-pair span { min-height: 27px; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }.price-pair s { color: #98a2b3; font-size: 10px; }.price-pair strong { margin-top: 2px; color: var(--brand-dark); font-size: 19px; }.price-pair small { color: var(--muted); font-size: 9px; }.save-strip { margin: 10px 0 1px; padding: 8px 10px; border-radius: 8px; background: var(--success-soft); color: var(--success); font-size: 10px; font-weight: 800; text-align: center; }.pricing-card ul { flex: 1; margin: 7px 0 22px; padding: 0; list-style: none; }.pricing-card li { position: relative; padding: 7px 0 7px 20px; border-bottom: 1px solid #f0f2f5; color: var(--ink-soft); font-size: 11px; line-height: 1.45; }.pricing-card li::before { position: absolute; left: 2px; content: "\2713"; color: var(--success); font-weight: 900; }.pricing-card .button { width: 100%; }
.subscription-feature-matrix { margin-top: 22px; padding: 0; overflow: hidden; scroll-margin-top: 90px; }.subscription-feature-matrix .section-heading { padding: 22px 24px 0; }.subscription-feature-matrix table { min-width: 980px; }.subscription-feature-matrix th:not(:first-child),.subscription-feature-matrix td:not(:first-child) { text-align: center; }.subscription-feature-matrix td:not(:first-child) { color: var(--success); font-weight: 900; }.subscription-feature-matrix .matrix-limit td:not(:first-child) { color: var(--brand-dark); }.subscription-feature-matrix tbody tr:nth-child(even) { background: #fbfdff; }
.subscription-action-grid { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(340px,.85fr); gap: 18px; margin-top: 22px; scroll-margin-top: 90px; }.subscription-estimator h2,.subscription-request-card h2 { margin: 5px 0 7px; font-size: 22px; }.estimate-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 21px; }.estimate-output { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }.estimate-output > div { padding: 18px; border: 1px solid var(--line); border-radius: 12px; background: #f8fafc; }.estimate-output .annual-estimate { border-color: #a7e3bd; background: var(--success-soft); }.estimate-output span,.estimate-output strong,.estimate-output small { display: block; }.estimate-output span { color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }.estimate-output strong { margin: 7px 0 4px; font-size: 26px; }.estimate-output small { color: var(--muted); font-size: 10px; }.annual-estimate strong,.annual-estimate small { color: var(--success); }.commercial-note { margin-top: 12px; padding: 11px 13px; border-left: 3px solid var(--warning); background: var(--warning-soft); color: #7a5315; font-size: 11px; line-height: 1.5; }.subscription-request-card .field { margin-bottom: 13px; }.subscription-request-button { width: 100%; }.request-assurance { margin: 10px 0 0; color: var(--muted); font-size: 10px; line-height: 1.5; text-align: center; }
.subscription-estimator .estimate-output { grid-template-columns: repeat(3,minmax(0,1fr)); }
.included-value { display: grid; grid-template-columns: minmax(240px,.65fr) minmax(0,1.5fr); gap: 24px; align-items: center; margin-top: 22px; }.included-value h2 { margin: 5px 0 0; font-size: 21px; }.included-value-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }.included-value-grid > div { min-height: 96px; padding: 13px; border-radius: 10px; background: #f8fafc; }.included-value-grid strong,.included-value-grid span { display: block; }.included-value-grid strong { margin-bottom: 6px; color: var(--brand-dark); font-size: 12px; }.included-value-grid span { color: var(--muted); font-size: 10px; line-height: 1.5; }

@media (max-width: 1350px) { .pricing-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.pricing-card > p { min-height: 58px; } }
@media (max-width: 1180px) { .metrics,.metric-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }.risk-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }.plan-summary { grid-template-columns: 1fr; }.plan-stat-grid { grid-template-columns: repeat(4,minmax(120px,1fr)); }.definition-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.definition-notes { grid-template-columns: repeat(2,minmax(0,1fr)); }.report-download-card { grid-template-columns: 38px minmax(0,1fr); }.report-download-card .button { grid-column: 2; justify-self: start; }.subscription-summary-card,.included-value { grid-template-columns: 1fr; }.subscription-summary-facts { grid-template-columns: repeat(2,minmax(0,1fr)); }.included-value-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 900px) { .app-layout { display: block; }.sidebar { position: static; width: 100%; height: auto; padding: 14px; }.brand { padding-bottom: 12px; }.workspace-card,.sidebar-foot,.nav-heading { display: none; }.side-nav { flex-direction: row; overflow-x: auto; padding-bottom: 3px; }.side-nav a { flex: 0 0 auto; }.topbar { position: static; padding: 12px 18px; }.header-context { display: none; }.account { margin-left: auto; }.page-shell { padding: 24px 18px 48px; }.two-col,.auth-shell,.profile-columns,.subscription-action-grid { grid-template-columns: 1fr; }.subscription-estimator .estimate-output { grid-template-columns: repeat(2,minmax(0,1fr)); }.auth-story { padding: 60px 30px; }.filter-row { align-items: stretch; flex-direction: column; }.filter-row .actions { justify-content: flex-start; }.period-controls,.report-range-fields { justify-content: flex-start; }.report-download-grid,.pricing-grid { grid-template-columns: 1fr; }.pricing-card > p { min-height: 0; } }
@media (max-width: 640px) { .page-title { align-items: flex-start; flex-direction: column; }.metrics,.metric-grid,.risk-grid,.definition-grid,.definition-notes,.profile-facts,.compact-profile-facts,.subscription-summary-facts,.estimate-fields,.estimate-output,.included-value-grid { grid-template-columns: 1fr; }.plan-stat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.notification-row { grid-template-columns: 36px minmax(0,1fr); }.notification-actions { grid-column: 2; }.account-name { display: none; }.work-data { grid-template-columns: 1fr; }.section-heading { align-items: flex-start; flex-direction: column; }.period-controls,.custom-date-range,.report-range-fields { width: 100%; align-items: stretch; flex-direction: column; }.period-selector,.custom-date-range .field.compact,.report-range-fields .field { width: 100%; min-width: 0; }.report-download-card { grid-template-columns: 38px minmax(0,1fr); }.profile-hero { grid-template-columns: 52px minmax(0,1fr); }.profile-avatar { width: 50px; height: 50px; border-radius: 14px; }.profile-hero .status-pill { grid-column: 2; justify-self: start; }.value-banner { grid-template-columns: 42px minmax(0,1fr); padding: 17px; }.value-banner-mark { width: 40px; height: 40px; }.value-saving { grid-column: 2; padding: 10px 0 0; border-left: 0; border-top: 1px solid #b9e8c9; text-align: left; }.price-pair { grid-template-columns: 1fr; } }

/* Keep QualityFlow dashboard cards compact at every viewport. */
.metric-grid.quality-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; width: 100%; }
.dashboard-period-card { margin-bottom: 18px; }
.dashboard-period-controls { align-items: flex-end; }
.dashboard-period-selector { width: 190px; min-width: 190px !important; margin-bottom: 0; }
.dashboard-custom-period { align-items: flex-end; }
.dashboard-custom-period .input { width: 165px; }
.metric-grid.quality-metrics .metric { display: flex; flex-direction: column; min-height: 156px; padding: 22px; }
.metric-grid.quality-metrics .metric .label { display: block; min-height: 31px; color: var(--ink-soft); font-size: 12px; line-height: 1.35; }
.metric-grid.quality-metrics .metric .value { margin: 8px 0 9px; font-size: clamp(25px,2vw,31px); line-height: 1.05; overflow-wrap: anywhere; }
.metric-grid.quality-metrics .metric-foot { margin-top: auto; line-height: 1.4; }
.metric-number { font-variant-numeric: tabular-nums; }
.metric-number.tone-blue { color: var(--brand); }
.metric-number.tone-cyan { color: var(--cyan); }
.metric-number.tone-violet { color: var(--violet); }
.metric-number.tone-green { color: var(--success); }
.metric-number.tone-amber { color: var(--warning); }
.metric-number.tone-red { color: var(--danger); }
.metric-number.tone-muted { color: var(--muted); }
.metric-separator { color: #98a2b3; font-weight: 600; }
@media (max-width: 1180px) { .metric-grid.quality-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 900px) { .metric-grid.quality-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 640px) { .metric-grid.quality-metrics { grid-template-columns: 1fr; }.dashboard-period-selector,.dashboard-custom-period,.dashboard-custom-period .input { width: 100%; min-width: 0 !important; } }

/* QualityFlow automatic-scoring audit workspace */
.qa-live-summary { display: grid; grid-template-columns: repeat(2,minmax(190px,1fr)); gap: 12px; min-width: min(460px,48%); }
.timer-card,.qa-score-card { min-height: 112px; padding: 16px 20px; border-radius: 14px; color: #fff; text-align: right; }
.timer-card { min-width: 0; background: #102a43; }
.qa-score-card { background: linear-gradient(145deg,#0f766e,#115e59); }
.timer-card small,.timer-card strong,.timer-card span,.qa-score-card small,.qa-score-card strong,.qa-score-card span { display: block; }
.timer-card strong,.qa-score-card strong { margin: 5px 0; font-size: 25px; font-variant-numeric: tabular-nums; }
.timer-card span,.qa-score-card span { color: rgba(255,255,255,.78); font-size: 11px; }
.timer-card .within-target { color: #6ee7b7; }
.timer-card .over-target { color: #fda4af; }
.qa-checklist-card,.qa-output-card { margin-top: 20px; }
.qa-check-row { grid-template-columns: minmax(260px,1.7fr) minmax(300px,1.25fr) minmax(220px,1fr) minmax(150px,.55fr); }
.qa-check-copy { min-width: 0; }
.auto-score-panel { align-self: stretch; display: flex; flex-direction: column; justify-content: center; min-height: 76px; padding: 11px 13px; border: 1px solid #cfe3df; border-radius: 10px; background: #f0fdfa; }
.auto-score-panel span,.auto-score-panel strong,.auto-score-panel small { display: block; }
.auto-score-panel span { color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.auto-score-panel strong { margin: 5px 0 2px; color: #0f766e; font-size: 18px; }
.auto-score-panel small { color: var(--muted); font-size: 10px; }
.qa-outcome-grid { display: grid; grid-template-columns: repeat(2,minmax(240px,1fr)); gap: 16px; max-width: 760px; }
.severity-field { transition: opacity .15s ease; }
.is-hidden { display: none !important; }
.error-category-section { margin: 20px 0; }
.error-category-section h3 { margin-bottom: 4px; }
.error-category-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 14px; align-items: stretch; margin-top: 14px; }
.error-category-box { display: flex; flex-direction: column; min-width: 0; min-height: 230px; padding: 16px; border: 1px solid #cfdde8; border-radius: 12px; background: #fbfdff; }
.error-category-box h4 { min-height: 38px; margin: 0 0 11px; padding-bottom: 10px; border-bottom: 1px solid var(--line); color: var(--brand-dark); font-size: 14px; }
.error-type-scroll { flex: 1; max-height: 230px; overflow-y: auto; padding-right: 5px; scrollbar-gutter: stable; }
.error-type-option { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 9px; align-items: start; padding: 8px 6px; border-bottom: 1px solid #edf1f5; color: var(--ink-soft); font-size: 12px; line-height: 1.4; cursor: pointer; }
.error-type-option:last-child { border-bottom: 0; }
.error-type-option input[type="checkbox"] { margin-top: 2px; }
@media (max-width: 1100px) { .qa-hero { display: block; }.qa-live-summary { min-width: 0; width: 100%; margin-top: 16px; }.qa-check-row { grid-template-columns: 1fr 1fr; } }

/* Expressive authentication and product-story layouts. */
@media (max-width: 1220px) {
  .auth-shell-rich { grid-template-columns: minmax(0,1.08fr) minmax(400px,.92fr); }
  .auth-shell-rich .auth-story { padding: 52px 44px; }
  .auth-shell-rich .auth-panel { padding: 46px 38px; }
  .auth-shell-rich .auth-story h1 { font-size: clamp(40px,4.8vw,56px); }
}
@media (max-width: 1000px) {
  .auth-shell-rich { grid-template-columns: 1fr; }
  .auth-shell-rich .auth-story { padding: 62px 44px; }
  .auth-shell-rich .auth-panel { padding: 62px 38px; }
  .auth-shell-rich .auth-story-content { width: min(820px,100%); }
  .auth-shell-rich .auth-form { width: min(580px,100%); }
  .auth-shell-rich .auth-brandline { margin-bottom: 46px; }
}
@media (max-width: 640px) {
  .auth-shell-rich .auth-story { padding: 42px 22px; }
  .auth-shell-rich .auth-panel { padding: 42px 22px; }
  .auth-shell-rich .auth-story h1 { font-size: clamp(37px,12vw,49px); letter-spacing: -1.8px; }
  .auth-shell-rich .auth-brandline { margin-bottom: 38px; }
  .auth-feature-grid,.auth-process,.auth-value-list { grid-template-columns: 1fr; }
  .auth-feature-card,.auth-process-step { min-height: 0; }
  .auth-proof-strip { align-items: stretch; flex-direction: column; }
  .auth-proof-strip > span { width: 100%; }
  .auth-trust-row { align-items: flex-start; flex-direction: column; gap: 11px; }
  .auth-form-brand { margin-bottom: 32px; }
  .auth-form h2 { font-size: 28px; }
  .auth-form-benefits { align-items: stretch; flex-direction: column; }
  .auth-trial-facts { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .auth-trial-heading { align-items: flex-start; flex-direction: column; }
  .auth-otp-actions { align-items: stretch; flex-direction: column; }
}
@media (max-width: 680px) { .qa-live-summary,.qa-outcome-grid,.qa-check-row { grid-template-columns: 1fr; }.timer-card,.qa-score-card { text-align: left; }.error-category-grid { grid-template-columns: 1fr; } }

/* QualityFlow management QA analysis */
.analysis-filter-card { margin-bottom: 18px; }
.analysis-filter-grid { display: grid; grid-template-columns: repeat(5,minmax(145px,1fr)) auto; gap: 12px; align-items: end; }
.analysis-filter-grid .field.compact { min-width: 0; }
.analysis-custom-range { display: grid; grid-template-columns: repeat(2,minmax(140px,1fr)); grid-column: span 2; gap: 12px; }
.analysis-run-button { align-self: end; }
.analysis-scope-line { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; }
.analysis-scope-line span { font-weight: 800; text-transform: uppercase; letter-spacing: .5px; }
.analysis-scope-line strong { color: var(--ink-soft); }
.analysis-scope-line small { margin-left: auto; }
.analysis-no-data { border-color: #b8d7ec; background: var(--brand-soft); color: var(--brand-dark); }
.quality-analysis-kpis { grid-template-columns: repeat(4,minmax(0,1fr)); }
.quality-analysis-kpis .metric { display: flex; flex-direction: column; min-height: 145px; }
.quality-analysis-kpis .metric .label { display: block; min-height: 30px; color: var(--ink-soft); line-height: 1.35; }
.quality-analysis-kpis .metric .value { margin: 7px 0 8px; }
.quality-analysis-kpis .metric-foot { margin-top: auto; line-height: 1.45; }
.analysis-section { margin-top: 24px; }
.analysis-threshold-note { color: var(--muted); font-size: 10px; }
.analysis-insight-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }
.analysis-insight { min-height: 155px; padding: 18px; border: 1px solid var(--line); border-top: 4px solid var(--brand); border-radius: 13px; background: white; box-shadow: 0 3px 13px rgba(16,24,40,.035); }
.analysis-insight > span { color: var(--muted); font-size: 9px; font-weight: 900; letter-spacing: .8px; text-transform: uppercase; }
.analysis-insight h3 { margin: 8px 0 7px; font-size: 16px; line-height: 1.35; }
.analysis-insight p { margin: 0; color: var(--ink-soft); font-size: 11px; line-height: 1.55; }
.analysis-insight.insight-critical { border-top-color: var(--danger); background: linear-gradient(180deg,#fff8f7,#fff); }
.analysis-insight.insight-watch { border-top-color: var(--warning); background: linear-gradient(180deg,#fffbf2,#fff); }
.analysis-insight.insight-good { border-top-color: var(--success); background: linear-gradient(180deg,#f4fcf7,#fff); }
.analysis-insight.insight-neutral { border-top-color: var(--brand); }
.pareto-section { padding: 24px; }
.pareto-list { display: grid; gap: 10px; }
.pareto-row { display: grid; grid-template-columns: minmax(260px,1.5fr) 76px minmax(190px,1fr) 85px; gap: 15px; align-items: center; padding: 13px 14px; border: 1px solid var(--line); border-radius: 11px; background: #fbfdff; }
.pareto-copy { min-width: 0; }
.pareto-copy strong,.pareto-copy small { display: block; }
.pareto-copy strong { margin: 6px 0 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pareto-copy small { color: var(--muted); font-size: 10px; }
.pareto-value { text-align: right; }
.pareto-value strong,.pareto-value span,.pareto-cumulative span,.pareto-cumulative strong { display: block; }
.pareto-value strong { color: var(--brand-dark); font-size: 22px; }
.pareto-value span,.pareto-cumulative span { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.pareto-track { height: 12px; overflow: hidden; border-radius: 99px; background: #e9eef4; }
.pareto-fill { display: block; height: 100%; border-radius: inherit; background: var(--brand); }
.pareto-fill.status-critical { background: linear-gradient(90deg,#f97316,var(--danger)); }
.pareto-cumulative { text-align: right; }
.pareto-cumulative strong { margin-top: 3px; }
.analysis-table-card { margin-top: 14px; padding: 0; overflow: hidden; }
.analysis-table-card > h3 { margin: 0; padding: 18px 20px; border-bottom: 1px solid var(--line); font-size: 16px; }
.analysis-table-card table { min-width: 1180px; }
.analysis-table-card td,.analysis-table-card th { font-size: 10px; }
.analysis-table-card td:first-child { color: var(--ink); font-weight: 700; }
.analysis-status { display: inline-flex; width: max-content; max-width: 180px; padding: 5px 8px; border-radius: 99px; font-size: 9px; font-weight: 800; line-height: 1.25; }
.analysis-status.status-critical { background: var(--danger-soft); color: var(--danger); }
.analysis-status.status-watch { background: var(--warning-soft); color: #8a5b13; }
.analysis-status.status-good { background: var(--success-soft); color: var(--success); }
.analysis-status.status-neutral { background: var(--brand-soft); color: var(--brand-dark); }
.tone-green { color: var(--success); font-weight: 800; }.tone-red { color: var(--danger); font-weight: 800; }.tone-amber { color: var(--warning); font-weight: 800; }.tone-muted { color: var(--muted); }.tone-blue { color: var(--brand); }.tone-violet { color: var(--violet); }.tone-cyan { color: var(--cyan); }
.resource-spotlight-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.resource-spotlight { padding: 0; overflow: hidden; }
.resource-spotlight > h3 { margin: 0; padding: 17px 19px; border-bottom: 1px solid var(--line); font-size: 16px; }
.resource-spotlight.coaching > h3 { border-left: 4px solid var(--danger); background: var(--danger-soft); }
.resource-spotlight.strong > h3 { border-left: 4px solid var(--success); background: var(--success-soft); }
.resource-spotlight-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px 12px; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.resource-spotlight-row:last-child { border-bottom: 0; }
.resource-spotlight-row strong,.resource-spotlight-row small,.resource-spotlight-row span { display: block; }
.resource-spotlight-row small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.resource-spotlight-row > div:nth-child(2) { text-align: right; }
.resource-spotlight-row p { grid-column: 1/-1; margin: 0; color: var(--ink-soft); font-size: 10px; }
.analysis-empty { padding: 25px 18px; color: var(--muted); text-align: center; }
.trend-scroll { overflow-x: auto; padding-bottom: 5px; }
.analysis-trend { display: flex; align-items: stretch; gap: 9px; min-width: max-content; min-height: 245px; padding: 12px 2px 0; }
.trend-day { display: grid; grid-template-rows: 24px 145px 18px 18px; width: 72px; text-align: center; }
.trend-day > strong { font-size: 10px; }
.trend-day > span { color: var(--ink-soft); font-size: 9px; }
.trend-day > small { color: var(--muted); font-size: 9px; }
.trend-bar-track { position: relative; align-self: stretch; width: 30px; height: 135px; margin: 0 auto; overflow: hidden; border-radius: 8px 8px 3px 3px; background: #edf2f7; }
.trend-bar { position: absolute; right: 0; bottom: 0; left: 0; min-height: 8px; border-radius: 7px 7px 2px 2px; background: linear-gradient(180deg,#38bdf8,var(--brand)); }
.analysis-method-note { margin-top: 22px; padding: 14px 16px; border-left: 4px solid var(--violet); border-radius: 8px; background: #f7f5ff; color: var(--ink-soft); font-size: 11px; line-height: 1.55; }
.trend-view-control { width: 180px; min-width: 180px !important; margin: 0; }
.quality-report-filter-card { margin-bottom: 18px; }
.quality-report-filter-grid { display: grid; grid-template-columns: repeat(4,minmax(165px,1fr)); gap: 12px; align-items: end; }
.quality-report-filter-grid .field { min-width: 0; margin: 0; }
.quality-report-filter-actions { align-self: end; min-height: 40px; }
.quality-report-results { padding: 0; overflow: hidden; }
.quality-report-results .section-heading { padding: 21px 22px 4px; }
.quality-report-results table { min-width: 1450px; }

@media (max-width: 1180px) { .analysis-filter-grid,.quality-report-filter-grid { grid-template-columns: repeat(3,minmax(150px,1fr)); }.quality-analysis-kpis,.analysis-insight-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 760px) { .analysis-filter-grid,.analysis-custom-range,.quality-report-filter-grid,.quality-analysis-kpis,.analysis-insight-grid,.resource-spotlight-grid { grid-template-columns: 1fr; }.analysis-custom-range { grid-column: auto; }.analysis-run-button,.quality-report-filter-actions,.quality-report-filter-actions .button,.trend-view-control { width: 100%; }.trend-view-control { min-width: 0 !important; }.quality-report-filter-actions { align-items: stretch; flex-direction: column; }.analysis-scope-line { align-items: flex-start; flex-direction: column; }.analysis-scope-line small { margin-left: 0; }.pareto-row { grid-template-columns: minmax(0,1fr) 65px; }.pareto-track { grid-column: 1/-1; }.pareto-cumulative { grid-column: 2; grid-row: 2; }.analysis-threshold-note { text-align: left; } }

/* QualityFlow controlled audit sampling */
.sampling-upload-card,.sampling-setup-card,.sampling-criteria-card,.sampling-output-card,.sampling-preview-card,.sampling-coverage-card { margin-top: 18px; }
.sampling-upload-card { margin-top: 0; }
.sampling-step-heading { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 18px; }
.sampling-step-heading > span { display: inline-grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 10px; background: var(--brand-soft); color: var(--brand-dark); font-size: 14px; font-weight: 900; }
.sampling-step-heading h2 { margin: 1px 0 4px; font-size: 20px; }
.sampling-step-heading p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.sampling-upload-row { display: grid; grid-template-columns: minmax(280px,1fr) auto; gap: 10px; align-items: center; }
.sampling-upload-row .input { min-width: 0; }
.sampling-limit-note { margin: 10px 0 0; font-size: 10px; }
.sampling-minimum-grid { display: grid; grid-template-columns: repeat(2,minmax(220px,320px)); gap: 14px; }
.sampling-minimum-grid .field { margin: 0; }
.sampling-minimum-grid small,.sampling-criterion-row small { display: block; margin-top: 5px; color: var(--muted); font-size: 9px; line-height: 1.4; }
.sampling-criteria-list { display: grid; gap: 12px; }
.sampling-criterion-row { display: grid; grid-template-columns: 62px minmax(150px,1fr) minmax(145px,.8fr) minmax(150px,1fr) minmax(125px,.7fr) minmax(100px,.5fr) minmax(175px,1fr) auto; gap: 10px; align-items: end; padding: 15px; border: 1px solid var(--line); border-radius: 12px; background: #fbfdff; }
.sampling-criterion-row .field { min-width: 0; margin: 0; }
.criterion-condition-panel { display: contents; }
.criterion-number { align-self: stretch; display: flex; flex-direction: column; justify-content: center; padding-right: 8px; border-right: 1px solid var(--line); }
.criterion-number span,.criterion-number strong { display: block; }.criterion-number span { color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }.criterion-number strong { margin-top: 3px; color: var(--brand-dark); font-size: 22px; }
.criterion-remove { margin-bottom: 1px; }
.sampling-no-criteria { padding: 25px 16px; border: 1px dashed #cbd5e1; border-radius: 11px; background: #fafcff; color: var(--muted); text-align: center; }
.sampling-actions { display: flex; justify-content: space-between; gap: 10px; margin-top: 16px; }
.sampling-result-section { margin-top: 25px; }
.sampling-result-metrics { grid-template-columns: repeat(4,minmax(0,1fr)); }
.sampling-result-metrics .metric { display: flex; flex-direction: column; min-height: 135px; }
.sampling-result-metrics .metric-foot { margin-top: auto; }
.sampling-result-metrics .value.tone-blue { color: var(--brand); }.sampling-result-metrics .value.tone-violet { color: var(--violet); }.sampling-result-metrics .value.tone-green { color: var(--success); }
.sampling-coverage-card { padding: 0; overflow: hidden; }.sampling-coverage-card .section-heading { padding: 20px 21px 0; }.sampling-coverage-card table { min-width: 900px; }.sampling-coverage-card > p { padding: 0 21px 16px; }
.sampling-output-actions { display: grid; grid-template-columns: auto minmax(280px,1fr) auto; gap: 12px; align-items: end; }
.sampling-output-actions .field { margin: 0; }
.sampling-output-card .alert { margin-bottom: 0; }
.sampling-preview-card { padding: 0; overflow: hidden; }.sampling-preview-card .section-heading { padding: 20px 21px 0; }.sampling-preview-card table { min-width: 1100px; }
@media (max-width: 1250px) { .sampling-criterion-row { grid-template-columns: 54px repeat(3,minmax(150px,1fr)); }.criterion-remove { grid-column: auto; }.sampling-result-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 760px) { .sampling-upload-row,.sampling-minimum-grid,.sampling-criterion-row,.sampling-output-actions,.sampling-result-metrics { grid-template-columns: 1fr; }.criterion-number { padding: 0 0 8px; border-right: 0; border-bottom: 1px solid var(--line); }.criterion-remove { grid-column: auto; }.sampling-actions { flex-direction: column; }.sampling-actions .button,.sampling-output-actions .button { width: 100%; } }