/* Support Flow — a restrained operations workspace. All assets are served locally. */
:root {
  --blue:#175cd3; --navy:#102b40; --canvas:#f3f5f7; --text:#172c3d;
  --muted:#657584; --border:#e1e7ec; --red:#b52c39; --green:#16724f; --amber:#946717;
  --sidebar:248px; --radius:12px;
}
* { box-sizing:border-box }
body { margin:0; background:var(--canvas); color:var(--text); font:14px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased }
button,input,select,textarea { font:inherit }
button { cursor:pointer }
a { color:inherit; text-decoration:none }
button,a { -webkit-tap-highlight-color:transparent }
button:disabled { cursor:not-allowed; opacity:.45 }
[hidden] { display:none!important }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #65a4ef; outline-offset:3px }
.icon { width:20px; height:20px; display:block; flex:none }
.sidebar { position:fixed; inset:0 auto 0 0; width:var(--sidebar); padding:32px 20px 20px; background:var(--navy); color:#a4b8c9; display:flex; flex-direction:column; z-index:10 }
.brand { display:flex; align-items:center; gap:13px; width:fit-content }
.brand-mark { width:35px; height:53px; flex:none }
.mark-blue { fill:#438ee0 }
.mark-dark { fill:#102b40 }
.sidebar .mark-dark { fill:#f3f7fc }
.brand-words { font-size:21px; line-height:1.1; font-weight:650; letter-spacing:-.7px; white-space:nowrap; color:var(--navy) }
.sidebar .brand-words { color:#fff }
.brand-agency { display:block; font-size:9px; letter-spacing:5.3px; font-weight:500; margin-top:9px; color:#688196 }
.sidebar .brand-agency { color:#9db2c4 }
.workspace-label { display:flex; align-items:center; gap:7px; font-size:11px; margin:26px 0 35px; color:#90a9bb; padding-top:22px; border-top:1px solid #ffffff16 }
.workspace-status { width:5px; height:5px; background:#70bea8; border-radius:50% }
.nav-label { font-size:10px; letter-spacing:1.8px; font-weight:600; color:#7892a6; margin:0 14px 13px }
.nav-item { width:100%; display:flex; align-items:center; gap:13px; padding:13px 14px; min-height:48px; border:1px solid transparent; border-radius:8px; background:none; color:#a7bdcd; font-size:14px; text-align:left; margin:5px 0; transition:background .15s,color .15s }
.nav-icon { display:grid; place-items:center; width:20px }
.nav-item.active { color:white; background:#24435a; border-color:#ffffff0a; box-shadow:inset 3px 0 #6eaafa; font-weight:600 }
.nav-item.active .icon { color:#86b8f6 }
.nav-item:hover { background:#ffffff0a; color:white }
.nav-count { margin-left:auto; padding:1px 7px; border-radius:5px; background:#ffffff0a; font-size:11px; font-variant-numeric:tabular-nums }
.sidebar-bottom { margin-top:auto; padding-top:40px }
.sidebar-note { border-top:1px solid #ffffff18; padding:24px 10px }
.sidebar-note-heading { display:flex; align-items:center; gap:8px }
.sidebar-note-heading .icon { width:16px; color:#7fa7c7 }
.sidebar-note strong { font-size:11px; font-weight:500; color:#becfdb }
.sidebar-note p { font-size:21px; line-height:1.4; letter-spacing:-.5px; color:#f0f5f8; margin:15px 0 13px }
.sidebar-note .text-button { color:#87b6e7; font-size:11px; display:flex; align-items:center; gap:8px }
.sidebar-note .text-button .icon { width:15px }
.user-card { display:flex; align-items:center; gap:10px; border-top:1px solid #ffffff18; padding-top:20px; font-size:12px; color:#e0e9ef }
.user-card small { display:block; color:#829db1; font-size:10px; margin-top:2px }
.user-card form { margin-left:auto }
.avatar { width:35px; height:35px; border:1px solid #ffffff1f; border-radius:50%; display:grid; place-items:center; background:#28475b; color:#d9e7f2; font-size:11px; font-weight:600; flex:none }
.avatar.small { width:32px; height:32px; background:#e9eff4; color:#546c80; border:1px solid #dbe4ec }
.signout { padding:8px; border:0; background:none; color:#9eb4c5 }
.signout .icon { width:17px }
.main { margin-left:var(--sidebar) }
.mobile-brand { display:none }
.topbar { height:76px; padding:0 40px; display:flex; align-items:center; justify-content:space-between; gap:20px; background:#fff; border-bottom:1px solid var(--border) }
.breadcrumb { font-size:12px; color:#8393a0; display:flex; gap:16px; align-items:center }
.breadcrumb strong { font-weight:550; color:#334f65 }
.breadcrumb-chevron { color:#c0ccd5 }
.top-actions { display:flex; align-items:center; gap:20px }
.private-label { display:flex; align-items:center; gap:7px; font-size:11px; color:#7c8b97 }
.private-label .icon { width:13px; height:13px }
.top-divider { width:1px; height:22px; background:var(--border) }
#firm-select { border:0; background:#fff; color:#405b71; font-size:12px; font-weight:550; max-width:250px; min-height:36px; padding:5px }
.content { padding:38px 40px 24px; max-width:1680px; margin:auto; min-height:calc(100vh - 76px) }
h1 { font-size:34px; line-height:1.2; font-weight:650; letter-spacing:-1.25px; margin:0 0 11px }
h2 { font-size:17px; font-weight:600; letter-spacing:-.35px; margin:0 }
h3 { font-size:14px; font-weight:600; margin:0 }
.eyebrow { color:#71879a; font-size:10px; letter-spacing:1.65px; font-weight:600; margin-bottom:11px }
.muted { color:var(--muted) }
.page-heading { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-bottom:29px }
.page-heading p { margin:0; color:#6c7e8e; font-size:13px; max-width:600px }
.heading-actions { display:flex; gap:10px; align-items:center; flex:none }
.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:42px; padding:10px 16px; border:1px solid transparent; border-radius:7px; font-size:12px; font-weight:600; white-space:nowrap; transition:background .15s,box-shadow .15s }
.button .icon { width:16px; height:16px }
.primary { background:var(--blue); color:white; box-shadow:0 2px 3px #15375d12 }
.primary:hover { background:#124fae; box-shadow:0 4px 10px #175cd320 }
.secondary { background:#fff; border-color:#d8e0e6; color:#415b6f }
.secondary:hover { background:#f7f9fb; border-color:#b8c8d4 }
.danger { color:var(--red); background:#fff5f5; border-color:#efced1 }
.full { width:100% }
.text-button { border:0; background:none; padding:5px 0; color:var(--blue); font-size:12px; font-weight:550 }
.icon-button,.close-challenge,.close-assignment { min-width:40px; min-height:40px; display:grid; place-items:center; border:0; border-radius:6px; background:none; color:#8394a2; font-size:27px }
.icon-button:hover,.close-challenge:hover,.close-assignment:hover { background:#eef2f6 }
.workspace-strip { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 20px; background:#eaf0f5; border:1px solid #dce5ed; border-radius:9px; margin-bottom:26px }
.workspace-strip>div { display:flex; align-items:center; gap:12px }
.workspace-icon,.identity-icon { display:grid; place-items:center; background:white; border:1px solid #dce5ee; border-radius:9px; width:40px; height:40px; color:#426f94; flex:none }
.workspace-strip strong { font-size:13px; font-weight:600 }
.workspace-strip small { display:block; color:#788c9d; font-size:11px; margin-top:3px }
.strip-meta { color:#74899a; font-size:11px; gap:20px!important }
.badge { display:inline-flex; align-items:center; gap:5px; padding:4px 8px; line-height:1.5; border-radius:5px; font-size:10px; font-weight:600; color:#227255; background:#eaf6ef; white-space:nowrap }
.badge.warning { color:#90671d; background:#fcf2dd }
.badge.red { color:#b23745; background:#fbecef }
.badge.neutral { color:#617587; background:#edf1f4 }
.badge.blue { color:#39669a; background:#eaf1fa }
.metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:28px }
.metric { position:relative; padding:21px 22px 18px; min-height:142px; background:#fff; border:1px solid var(--border); border-radius:var(--radius); text-align:left; color:var(--text); box-shadow:0 2px 3px #152f4603 }
.metric:hover { border-color:#b3c7d8 }
.metric-label { display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:12px; font-weight:500; color:#677f91 }
.metric-icon { display:grid; place-items:center; width:30px; height:30px; color:#436f9d; background:#edf3f9; border-radius:8px }
.metric-icon .icon { width:17px; height:17px }
.metric-value { display:block; font-size:36px; font-weight:600; line-height:1.1; letter-spacing:-1.2px; margin:7px 0 11px; font-variant-numeric:tabular-nums }
.metric small { display:block; font-size:10px; color:#8495a3 }
.metric.amber .metric-icon { color:#a17c35; background:#faf3e6 }
.metric.rose .metric-icon { color:#b45161; background:#fbf0f2 }
.metric.green .metric-icon { color:#438b70; background:#edf7f2 }
.overview-grid { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(290px,1fr); gap:24px; margin-bottom:26px }
.panel { background:#fff; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; margin-bottom:26px; box-shadow:0 2px 3px #152f4603 }
.overview-grid>.panel { margin-bottom:0 }
.panel-heading { padding:23px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px }
.panel-heading p { font-size:11px; color:#80919f; margin:5px 0 0 }
.panel-heading .text-button { font-size:11px }
.panel-body { padding:0 24px 24px }
.panel-body>.scope-grid:first-child { padding-top:24px }
.section-icon { color:#8ca2b3 }
.empty-state { min-height:170px; padding:36px 24px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center }
.empty-icon { width:46px; height:46px; border:1px solid #e0e8ef; background:#f6f9fb; color:#7b96ae; border-radius:12px; display:grid; place-items:center; margin-bottom:16px }
.empty-state strong { font-size:14px; font-weight:600 }
.empty-state p { font-size:12px; color:#8293a2; margin:8px 0 18px; max-width:420px }
.risk-row { display:grid; grid-template-columns:180px minmax(0,1fr) 28px; gap:18px; align-items:center; font-size:12px; color:#657e90; margin:20px 0 }
.risk-track { height:7px; background:#edf1f4; border-radius:3px; overflow:hidden }
.risk-track>span { display:block; height:100%; background:#3c739e; border-radius:3px }
.risk-row strong { text-align:right; font-size:12px; font-weight:600; color:#405b70; font-variant-numeric:tabular-nums }
.risk-caveat { font-size:10px; color:#91a0ad; border-top:1px solid #edf1f4; padding-top:15px; margin-top:24px }
.readiness { display:flex; flex-direction:column; align-items:center; padding:0 24px 20px }
.readiness-ring { width:142px; height:142px; position:relative; margin:0 0 16px }
.readiness-ring svg { width:100%; height:100%; transform:rotate(-90deg) }
.readiness-ring circle { fill:none; stroke:#edf1f4; stroke-width:7 }
.readiness-ring .ring-progress { stroke:#267e88; stroke-linecap:round; stroke-dasharray:0 327 }
.ring-label { position:absolute; inset:0; display:grid; place-content:center; text-align:center }
.ring-label strong { font-size:32px; line-height:1.2; font-weight:600; letter-spacing:-1px }
.ring-label small { font-size:9px; color:#8a9aa8; display:block }
.ring-label strong small { display:inline; font-size:15px; letter-spacing:0 }
.readiness>strong { font-size:12px; font-weight:600 }
.readiness>p { font-size:11px; color:#8495a3; text-align:center; max-width:250px; margin:8px 0 18px }
.readiness-lines { width:100%; border-top:1px solid #e9eef2; padding-top:10px }
.readiness-lines>div { display:flex; justify-content:space-between; gap:10px; padding:7px 0; font-size:10px; color:#7f92a1 }
.readiness-lines strong { color:#466276; font-weight:600 }
.table-wrap { width:100%; overflow:auto }
table { width:100%; border-collapse:collapse; text-align:left; white-space:nowrap; font-variant-numeric:tabular-nums }
th { background:#f7f9fb; color:#627b8d; font-size:10px; font-weight:600; letter-spacing:.6px; padding:13px 22px; border-block:1px solid #e9eef3; text-transform:uppercase }
td { padding:17px 22px; border-bottom:1px solid #edf1f4; color:#4d667a; font-size:13px }
tr:last-child td { border-bottom:0 }
tbody tr:hover { background:#fafcfd }
td strong { color:#2c4b62; font-size:12px; font-weight:600 }
td small { display:block; color:#8b9eac; font-size:10px; margin-top:4px }
td:last-child { text-align:right }
.account-id { display:flex; align-items:center; gap:12px }
.account-monogram { display:grid; place-items:center; width:35px; height:35px; border:1px solid #dfe7ee; border-radius:9px; font-size:9px; font-weight:600; color:#6c869c; background:#f4f7fa }
.row-button { border:1px solid #dce5ed; border-radius:6px; color:#386a98; background:white; padding:8px 11px; min-height:35px; font-size:11px; white-space:nowrap }
.row-button:hover { background:#edf4fa; border-color:#b7ccdc }
.positive { color:#287957 }
.negative { color:#b24754 }
.pager { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:16px 22px; font-size:11px; color:#8195a5; border-top:1px solid #edf1f4 }
.pager-actions { display:flex; align-items:center; gap:8px }
.pager button { background:#fff; border:1px solid #dce4eb; border-radius:5px; padding:7px 11px; min-height:32px; color:#56748b; font-size:11px }
.tabs { display:flex; gap:26px; padding:0 24px; border-bottom:1px solid var(--border); overflow:auto }
.tab { border:0; border-bottom:2px solid transparent; background:none; color:#7b90a0; font-size:12px; padding:18px 0 16px; min-height:50px; white-space:nowrap }
.tab.active { border-bottom-color:var(--blue); color:var(--blue); font-weight:600 }
.filter-bar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; padding:20px 22px }
input:not([type=checkbox]):not([type=hidden]),select,textarea { min-height:42px; padding:10px 12px; border:1px solid #dce4eb; border-radius:6px; background:#fff; color:#405e75; font-size:12px }
input::placeholder,textarea::placeholder { color:#96a5b1 }
.search { width:285px; max-width:100% }
.filter-bar select { min-width:135px; max-width:195px; color:#657e91; font-size:11px }
.result-count { margin-left:auto; color:#7891a3; font-size:11px }
.filter-chips { display:flex; flex-wrap:wrap; gap:7px; padding:0 22px 14px }
.filter-chips:empty { display:none }
.filter-chip { padding:4px 9px; border:1px solid #d7e4ef; border-radius:5px; background:#f3f8fc; color:#587e9e; font-size:10px }
.filter-clear { border:0; background:none; color:var(--blue); font-size:10px }
.account-note { padding:13px 17px; border-left:2px solid #9db8ce; background:#eaf0f5; color:#6c8497; font-size:11px; border-radius:0 6px 6px 0; margin:0 0 25px }
.activity-list { padding:0 24px 12px }
.activity-item { display:flex; gap:13px; align-items:flex-start; padding:16px 0; border-top:1px solid #edf1f4 }
.activity-icon { width:30px; height:30px; display:grid; place-items:center; background:#f3f7fa; color:#7291a9; border-radius:8px; flex:none }
.activity-icon .icon { width:16px; height:16px }
.activity-item p { margin:0 0 3px; color:#537188; font-size:12px }
.activity-item small,.activity-item time { color:#8ca0af; font-size:10px }
.activity-item time { margin-left:auto; flex:none }
.back-button { border:0; padding:0; background:none; min-height:28px; color:#69849a; font-size:11px; margin:0 0 20px }
.review-identity { display:flex; gap:14px; align-items:center }
.identity-icon { width:44px; height:44px }
.review-context { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-top:7px }
.review-context span { font-size:10px; color:#8196a6 }
.review-context .badge { color:#39669a }
.coverage-banner { display:flex; align-items:center; gap:12px; padding:15px 18px; margin-bottom:26px; background:#fffcf4; border:1px solid #ede3cc; border-radius:8px; color:#8b7137; font-size:11px }
.coverage-banner>.section-icon { color:#a58a53 }
.coverage-banner strong { font-size:12px; font-weight:600; display:block }
.coverage-banner p { color:#9f8c65; margin:3px 0 0 }
.coverage-banner .button { margin-left:auto; min-height:36px; font-size:11px }
.review-layout { display:grid; grid-template-columns:minmax(0,1.9fr) minmax(290px,1fr); gap:24px; align-items:start }
.rule-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:0 24px 24px }
.rule-card { display:flex; align-items:center; gap:12px; text-align:left; min-height:94px; padding:16px; border:1px solid #dfe7ed; border-radius:9px; background:#f8fafb; color:#627b8e; transition:box-shadow .15s,border-color .15s }
.rule-card:hover { box-shadow:0 4px 12px #173e5310; border-color:currentColor }
.rule-state-icon { width:32px; height:32px; border-radius:8px; background:#edf1f5; display:grid; place-items:center; flex:none; font-size:17px }
.rule-state-icon .icon { width:17px; height:17px }
.rule-card strong { display:block; font-size:12px; line-height:1.45; font-weight:600 }
.rule-card small { display:block; font-size:10px; margin-top:5px; opacity:.8 }
.rule-card-count { margin-left:auto; padding-left:4px; font-size:10px; white-space:nowrap }
.rule-violation { background:#fdf4f5; color:#ab4050; border-color:#efd5db }
.rule-violation .rule-state-icon { background:#f7e2e7 }
.rule-pass { background:#f1f8f5; color:#2b795a; border-color:#d4e8de }
.rule-pass .rule-state-icon { background:#e0f0e7 }
.rule-unverified { background:#fdf9ef; color:#977124; border-color:#eee2c5 }
.rule-unverified .rule-state-icon { background:#f6edd6 }
.rules-foot { padding:0 24px 22px; font-size:10px; line-height:1.7; color:#8da0af }
.rule-filter { padding:0 24px 19px; display:flex; flex-wrap:wrap; gap:5px }
.rule-filter button { border:1px solid transparent; background:#f5f7f9; color:#8498a8; padding:6px 9px; border-radius:5px; font-size:10px }
.rule-filter button.active { color:#386b9b; border-color:#d8e5f1; background:#edf4fb }
.decision-panel { border-top:3px solid #254e6d }
.decision-panel .panel-body { text-align:center }
.decision-symbol { width:56px; height:56px; margin:12px auto 18px; display:grid; place-items:center; background:#f0f5f9; border:1px solid #dde7ef; color:#5e819d; border-radius:16px; font-size:27px }
.decision-symbol .icon { width:25px; height:25px }
.decision-panel h3 { font-size:14px }
.decision-panel p { color:#869cab; font-size:11px; margin:10px 0 20px }
.decision-meta { border-top:1px solid #e9eef3; margin-top:22px; padding-top:15px; text-align:left }
.decision-meta>div { display:flex; justify-content:space-between; gap:12px; font-size:10px; margin:10px 0; color:#8b9fac }
.decision-meta strong { color:#58778f; font-weight:600; text-align:right }
.note-editor { width:100%; display:block; margin:12px 0 }
.workflow-controls { display:flex; gap:10px; align-items:center; flex-wrap:wrap }
.workflow-controls select { flex:1; min-width:160px }
.scope-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px }
.scope-grid span { display:block; font-size:10px; color:#8ca1b0; margin-bottom:6px }
.scope-grid strong { font-size:12px; color:#54738b; font-weight:550 }
.evidence-warning { border:1px solid #ece1c8; padding:13px 16px; background:#fcf9f1; color:#9a834e; font-size:11px; border-radius:7px; margin:18px 0 }
.challenge-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px }
.challenge-card { padding:0 24px 23px; border-top:3px solid #2c628b }
.challenge-card-top { display:flex; align-items:center; gap:10px; padding-top:23px }
.challenge-symbol { display:grid; place-items:center; width:38px; height:38px; border-radius:10px; background:#eaf2f9; color:#457aa5 }
.challenge-symbol .icon { width:21px; height:21px }
.version-label { margin-left:auto; color:#8fa3b2; font-size:10px }
.challenge-card h2 { font-size:23px; letter-spacing:-.6px; margin:24px 0 6px }
.challenge-card>p { color:#6b8497; font-size:12px; margin:0 0 24px }
.challenge-rule-list>div { display:flex; justify-content:space-between; gap:10px; border-top:1px solid #edf1f4; padding:13px 0; font-size:12px }
.challenge-rule-list span { color:#647e92 }
.challenge-rule-list strong { color:#4c6e87; font-weight:600 }
.challenge-card-foot { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:16px; color:#8ba3b4; font-size:10px }
.section-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px }
.email-settings { border-top:1px solid var(--border); padding-top:18px; margin-top:20px }
.email-settings summary,details>summary { cursor:pointer; color:#658398; font-size:12px; font-weight:500 }
.triage-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 0; border-top:1px solid var(--border); font-size:12px }
.triage-row small { display:block; font-size:10px; color:#8ca2b2 }
.demo-banner,.status-message { padding:11px 15px; background:#fff9e9; border:1px solid #eaddbd; border-radius:7px; color:#9d8141; font-size:11px; margin-bottom:24px }
.status-message.error { background:#fff1f2; border-color:#f0cfd6; color:#af4050 }
footer { display:flex; gap:12px; align-items:center; color:#9aabb7; font-size:10px; margin-top:32px; padding-top:18px; border-top:1px solid #e3e9ee }
footer strong { font-weight:600; color:#839bac }
footer>span:last-child { margin-left:auto; font-size:9px }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0) }
dialog { width:min(580px,calc(100vw - 32px)); max-height:90vh; overflow:auto; padding:28px; border:1px solid #dce5ed; border-radius:14px; color:var(--text); box-shadow:0 24px 100px #071e3a35 }
dialog::backdrop { background:#071e3a8c; backdrop-filter:blur(4px) }
.dialog-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:15px }
.dialog-heading h2 { font-size:21px; letter-spacing:-.5px }
.dialog-heading .icon-button,.dialog-heading .close-challenge,.dialog-heading .close-assignment { margin:-8px -8px 0 0 }
.dialog-heading+.muted { font-size:12px; line-height:1.8 }
.dialog-actions { display:flex; justify-content:flex-end; gap:10px; border-top:1px solid #edf1f4; padding-top:22px; margin-top:26px }
label { display:block; color:#607c91; font-size:12px; margin-top:19px; font-weight:500 }
label>input,label>select,label>textarea { display:block; width:100%; margin-top:8px }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 16px }
.checkbox-label { display:flex; gap:10px; align-items:flex-start; font-size:11px; line-height:1.7 }
.checkbox-label>input { width:auto; margin:3px 0 0 }
.policy-note { padding:14px 16px; background:#f1f6fa; border:1px solid #dfebf3; border-radius:7px; color:#6c8ca4; font-size:11px; line-height:1.8; margin-top:20px }
.error { font-size:12px; color:var(--red) }
.rule-switches { display:flex; flex-wrap:wrap; gap:0 12px }
.rule-switches label { display:flex; align-items:center; gap:6px; font-size:11px }
.rule-switches input { margin:0; width:auto }
.evidence-dialog { width:min(1050px,calc(100vw - 48px)) }
.trade-dialog { width:min(760px,calc(100vw - 48px)) }
.evidence-group { border:1px solid #e0e8ef; border-radius:9px; overflow:hidden; margin:20px 0 }
.evidence-group-heading { background:#f5f8fb; padding:18px; display:flex; justify-content:space-between; align-items:flex-start; gap:15px }
.evidence-group-heading h3 { font-size:13px }
.evidence-group-heading p { font-size:11px; color:#7d97ab; margin:6px 0 0 }
.evidence-source { background:#f5f8fb; border:1px solid #e0e8ef; border-radius:7px; padding:16px; font-size:11px; line-height:1.8; color:#7c95a8; margin:18px 0 }
.trade-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:22px 0 }
.trade-metrics>div { padding:15px; background:#f8fafc; border:1px solid #e5ebf1; border-radius:8px }
.trade-metrics span { display:block; font-size:10px; color:#8a9fb0 }
.trade-metrics strong { display:block; font-size:18px; font-weight:550; margin-top:7px; color:#3a5e79 }
.trade-metrics strong.date { font-size:12px }
.trade-reference { font-size:11px; color:#7e9bb0; padding:13px; border-radius:7px; background:#f0f5f9 }
.skeleton-heading { max-width:440px; height:65px; border-radius:9px; margin:15px 0 25px; background:#e5ebf0; animation:pulse 1.5s infinite }
.skeleton-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px }
.skeleton-grid>div { height:140px; background:#e9eef3; border-radius:12px; animation:pulse 1.5s infinite }
.login-page { min-height:100vh; display:grid; grid-template-columns:1fr 1fr; place-items:center; background:linear-gradient(90deg,#102b40 50%,#f4f6f8 50%) }
.login-story { color:#fff; padding:70px; max-width:650px }
.login-story>.eyebrow { color:#8ab7dc; font-size:11px }
.login-story h2 { font-size:62px; font-weight:500; line-height:1.12; letter-spacing:-3px; margin:42px 0 25px }
.login-story h2>span { color:#84b8e6 }
.login-story p { color:#9bb3c5; font-size:14px; line-height:1.9 }
.login-story-line { width:50px; height:2px; background:#438ee0; margin:50px 0 18px }
.login-story>small { color:#6287a2; font-size:9px; letter-spacing:1.6px }
.login-card { width:min(400px,calc(100vw - 40px)); padding:30px 8px; margin:35px }
.login-card .brand { margin-bottom:48px }
.login-card .brand-mark { width:33px; height:50px }
.login-card .brand-words { font-size:23px }
.login-card h1 { font-size:36px; margin:0 0 16px }
.login-card>.muted { font-size:12px; line-height:1.8; margin-bottom:26px }
.login-card .button { width:100%; justify-content:space-between; margin-top:27px; min-height:46px }
.login-foot { color:#95a7b5; text-align:center; font-size:10px; margin:30px 0 0 }

.directory-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; padding:23px 25px; background:white; border:1px solid var(--border); border-radius:12px; margin-bottom:23px }
.directory-summary>div { display:flex; align-items:center; gap:14px; border-right:1px solid #e5ebf0 }
.directory-summary>div:last-child { border:0 }
.directory-icon { width:42px; height:42px; background:#f0f5f9; color:#4d7a9d; border:1px solid #e2ebf2; border-radius:10px; display:grid; place-items:center; flex:none }
.directory-summary strong { font-size:25px; font-weight:600; line-height:1.2; letter-spacing:-.6px; display:block }
.directory-summary div>span:not(.directory-icon) { font-size:11px; color:#7c92a3; display:block; margin-top:4px }

@keyframes pulse { 50% {opacity:.5} }
@media(min-width:1500px) { .content { padding-top:44px } .rule-card { min-height:105px } }
@media(max-width:1250px) { :root { --sidebar:220px } .sidebar { padding-inline:16px } .brand-words { font-size:19px } .brand-mark { width:31px } .content { padding:30px 26px 22px } .topbar { padding-inline:26px } .review-layout { grid-template-columns:1fr } .review-layout .decision-panel .panel-body { text-align:left } .decision-symbol { margin:8px 0 16px } .challenge-grid { grid-template-columns:repeat(2,minmax(0,1fr)) } .private-label { display:none } .overview-grid { grid-template-columns:minmax(0,1.4fr) minmax(260px,1fr) } .risk-row { grid-template-columns:155px minmax(0,1fr) 25px; gap:12px } .metric { padding:18px } .metric-label { font-size:11px } }
@media(max-width:1000px) { :root { --sidebar:205px } .brand { gap:9px } .brand-words { font-size:18px } .brand-agency { letter-spacing:4px } .workspace-label { font-size:10px } .metrics { grid-template-columns:repeat(2,minmax(0,1fr)) } .overview-grid { grid-template-columns:1fr } .challenge-grid { grid-template-columns:1fr } .scope-grid { grid-template-columns:repeat(2,minmax(0,1fr)) } .page-heading { align-items:flex-start } .heading-actions { flex-wrap:wrap; justify-content:flex-end } .strip-meta { display:none!important } .panel-heading { gap:10px } .panel-heading .text-button { max-width:150px; text-align:right } h1 { font-size:30px } .login-story { padding:35px } .login-story h2 { font-size:48px } }
@media(max-width:767px) {
  .sidebar { inset:auto 0 0; width:100%; height:72px; padding:0; display:block; background:#102b40; border:0; box-shadow:0 -2px 18px #102b401a }
  .sidebar>.brand,.workspace-label,.nav-label,.sidebar-bottom { display:none }
  .sidebar nav { display:grid; grid-template-columns:repeat(4,1fr); height:100% }
  .nav-item { flex-direction:column; justify-content:center; gap:4px; margin:0; border:0; border-radius:0; padding:8px 2px; font-size:10px; min-height:72px }
  .nav-item.active { box-shadow:inset 0 2px #76b3f4; background:#1d3c53 }
  .nav-icon .icon { width:19px; height:19px }
  .nav-count { display:none }
  .directory-summary { gap:17px; padding:18px; grid-template-columns:1fr }
  .directory-summary>div { border-right:0; border-bottom:1px solid #edf1f4; padding-bottom:16px }
  .directory-summary>div:last-child { padding-bottom:0 }
  .directory-summary strong { font-size:23px }
  .directory-icon { width:38px; height:38px }
  .main { margin-left:0; padding-bottom:72px }
  .topbar { height:61px; padding:0 18px; gap:10px }
  .mobile-brand { display:flex; flex:none }
  .mobile-brand .brand-words { display:none }
  .mobile-brand .brand-mark { width:19px; height:34px }
  .breadcrumb { margin-right:auto; gap:9px; font-size:11px }
  .breadcrumb-home { display:none }
  .breadcrumb-chevron { display:none }
  .top-actions { gap:8px }
  .top-divider,.avatar.small { display:none }
  #firm-select { max-width:165px; font-size:10px; padding:4px 0 }
  .content { padding:26px 18px 20px }
  h1,.page-heading h1 { font-size:28px; letter-spacing:-1px }
  .page-heading { flex-wrap:wrap; gap:18px; margin-bottom:24px }
  .page-heading p { font-size:12px }
  .heading-actions { gap:8px; justify-content:flex-start }
  .heading-actions .button { font-size:11px; padding:9px 12px; min-height:40px }
  .eyebrow { font-size:9px; margin-bottom:10px }
  .workspace-strip { padding:13px; margin-bottom:22px }
  .workspace-strip small { font-size:10px }
  .workspace-strip strong { font-size:12px }
  .workspace-icon { width:35px; height:35px }
  .metrics { gap:12px; margin-bottom:23px }
  .metric { padding:16px; min-height:140px }
  .metric-label { font-size:10px; gap:5px }
  .metric-icon { width:26px; height:26px; flex:none }
  .metric-icon .icon { width:15px; height:15px }
  .metric-value { font-size:32px; margin:10px 0 }
  .metric small { font-size:9px; line-height:1.6 }
  .overview-grid { gap:22px; margin-bottom:22px }
  .panel { margin-bottom:22px; border-radius:10px }
  .panel-heading { padding:20px 18px; flex-wrap:wrap }
  .panel-heading h2 { font-size:16px }
  .panel-heading p { font-size:10px }
  .panel-heading .text-button { font-size:10px; max-width:none }
  .panel-body { padding:0 18px 20px }
  .risk-row { grid-template-columns:143px minmax(0,1fr) 20px; gap:9px; font-size:11px }
  .risk-caveat { font-size:9px; line-height:1.7 }
  .mobile-cards table,.mobile-cards thead,.mobile-cards tbody,.mobile-cards tr,.mobile-cards td { display:block; width:100%; white-space:normal }
  .mobile-cards thead { display:none }
  .mobile-cards tr { padding:19px 18px; border-bottom:1px solid var(--border); display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:15px 12px }
  .mobile-cards td { padding:0; border:0; font-size:11px }
  .mobile-cards td:before { content:attr(data-label); display:block; font-size:9px; text-transform:uppercase; letter-spacing:.6px; color:#8ca1b1; margin-bottom:5px }
  .mobile-cards td:first-child { grid-column:1/-1 }
  .mobile-cards td:last-child { grid-column:1/-1; text-align:left; padding-top:3px }
  .mobile-cards td:last-child:before { display:none }
  .mobile-cards td:last-child .row-button { width:100%; min-height:40px; background:#f6f9fc }
  th,td { padding:13px 17px }
  .tabs { padding:0 18px; gap:22px }
  .tab { font-size:11px; padding-block:16px }
  .filter-bar { padding:18px; gap:9px }
  .filter-bar .search { width:100% }
  .filter-bar select { flex:1; min-width:120px; max-width:none }
  .result-count { display:none }
  .filter-chips { padding-inline:18px }
  .pager { padding:14px 18px; flex-wrap:wrap; font-size:10px }
  .account-note { font-size:10px; line-height:1.8; margin-bottom:22px }
  .scope-grid { gap:22px 16px }
  .review-layout { gap:0 }
  .rule-grid { grid-template-columns:1fr; padding:0 18px 20px }
  .rule-card { min-height:90px }
  .rule-card strong { font-size:12px }
  .rule-filter { padding:0 18px 18px }
  .rules-foot { padding:0 18px 20px }
  .coverage-banner { padding:14px; align-items:flex-start; flex-wrap:wrap; font-size:10px }
  .coverage-banner .button { margin-left:0 }
  .coverage-banner strong { font-size:11px }
  .activity-list { padding-inline:18px }
  .activity-item { gap:9px; flex-wrap:wrap }
  .activity-item p { font-size:11px }
  .activity-item time { font-size:9px }
  .activity-item>div { flex:1; min-width:120px }
  .challenge-card { padding:0 20px 20px }
  .challenge-card h2 { font-size:23px }
  footer { flex-wrap:wrap; gap:6px; font-size:9px }
  footer>span:last-child { margin:4px 0 0; width:100%; font-size:9px }
  .form-grid { grid-template-columns:1fr }
  dialog { padding:22px; max-height:92vh }
  .dialog-heading h2 { font-size:19px }
  .dialog-actions .button { flex:1 }
  .evidence-dialog { width:100%; height:100%; max-height:100%; max-width:100%; margin:0; border:0; border-radius:0; padding:20px 18px }
  .evidence-dialog .dialog-heading { position:sticky; top:-20px; padding:14px 0; background:#fff; z-index:1; border-bottom:1px solid var(--border) }
  .trade-dialog { width:calc(100vw - 20px) }
  .trade-metrics { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .evidence-group-heading { flex-wrap:wrap }
  .skeleton-grid { grid-template-columns:repeat(2,1fr) }
  .login-page { display:grid; grid-template-columns:1fr; background:#f4f6f8 }
  .login-story { display:none }
  .login-card { margin:0; padding:35px 8px }
}
@media(prefers-reduced-motion:reduce) { * { animation:none!important; transition:none!important } }