:root {
  --bg: #eef3f2;
  --surface: #ffffff;
  --surface-soft: #f6f8f8;
  --line: #d8e0df;
  --line-strong: #b7c5c3;
  --text: #162126;
  --muted: #66757a;
  --muted-strong: #48595f;
  --nav: #143c3f;
  --nav-soft: #1d5858;
  --brand: #0f766e;
  --brand-2: #2f6f8f;
  --green: #176f4d;
  --amber: #b88422;
  --red: #b3261e;
  --slate: #667085;
  --gold-soft: #fff7e3;
  --shadow: 0 18px 46px rgba(20, 60, 63, 0.14);
}

* { box-sizing: border-box; }
html { min-width: 320px; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Microsoft YaHei", "PingFang SC", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0;
}
button, input, select { font: inherit; }
button { cursor: pointer; }
h1, h2, h3, p { margin: 0; }
input, select { color: var(--text); }
.is-hidden { display: none !important; }

i[data-lucide] { display: inline-grid; place-items: center; width: 18px; height: 18px; font-style: normal; line-height: 1; }
i[data-lucide]::before { content: attr(data-fallback); font-size: 14px; }

.login-screen {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(430px, .92fr) minmax(520px, 1.08fr);
  background:
    linear-gradient(120deg, rgba(255,255,255,0) 0 47%, rgba(246,249,248,.94) 47% 100%),
    linear-gradient(135deg, #0b2f32 0%, #16484a 48%, #edf3f1 48%, #edf3f1 100%);
}
.login-aside {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 100vh;
  padding: 42px 48px;
  color: #fff;
  overflow: hidden;
  background: linear-gradient(135deg, #0b2f32 0%, #16484a 58%, #0f5f5b 100%);
}
.login-aside::before {
  content: "";
  position: absolute;
  inset: 104px 42px 142px 42px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 8px;
}
.login-aside::after {
  content: "";
  position: absolute;
  right: 36px;
  bottom: 108px;
  width: 248px;
  height: 136px;
  border-right: 4px solid rgba(212,166,62,.58);
  border-bottom: 4px solid rgba(212,166,62,.58);
  transform: skewX(-14deg);
}
.login-brand, .brand { display: flex; align-items: center; gap: 12px; }
.login-brand { position: relative; z-index: 1; }
.brand-mark {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 8px;
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
  color: #fff;
  font-weight: 800;
}
.brand-mark.large { width: 46px; height: 46px; }
.login-brand strong, .login-brand span, .brand strong, .brand span { display: block; }
.login-brand strong, .brand strong { font-size: 16px; }
.login-brand span, .brand span { margin-top: 3px; color: rgba(255,255,255,.74); font-size: 12px; }
.login-copy { position: relative; z-index: 1; max-width: 540px; }
.gov-badge {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  padding: 5px 12px;
  border: 1px solid rgba(255, 226, 160, .58);
  border-radius: 999px;
  background: rgba(184,132,34,.28);
  color: #fff2c8;
  font-size: 13px;
  font-weight: 600;
}
.login-copy h1 { margin-top: 22px; max-width: 500px; color: #fff; font-size: 42px; line-height: 1.22; }
.login-copy p { margin-top: 18px; max-width: 500px; color: rgba(255,255,255,.9); font-size: 16px; line-height: 1.8; }
.login-stats { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.login-stats div { min-height: 76px; padding: 13px; border: 1px solid rgba(255,226,160,.3); border-radius: 8px; background: rgba(7,34,36,.68); box-shadow: 0 10px 24px rgba(0,0,0,.14); }
.login-stats span, .login-stats strong { display: block; }
.login-stats span { color: #d8e8e4; font-size: 12px; }
.login-stats strong { margin-top: 8px; color: #fff4c8; font-size: 25px; }
.login-panel { display: grid; align-items: center; justify-items: center; padding: 40px; }
.login-card { width: min(520px,100%); padding: 32px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.98); box-shadow: var(--shadow); }
.login-card h2 { margin-top: 6px; font-size: 28px; color: var(--text); }
.login-card p { margin-top: 8px; color: var(--muted-strong); line-height: 1.6; }
.login-field { display: grid; gap: 7px; margin-top: 18px; color: var(--muted-strong); font-size: 13px; }
.login-field input, .date-range input { height: 38px; border: 1px solid var(--line); border-radius: 8px; background: #fff; padding: 0 11px; outline: 0; }
.login-field input:focus, .date-range input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(15,118,110,.12); }
.login-org { display: grid; gap: 5px; margin-top: 18px; padding: 12px 14px; border: 1px solid #d8e6df; border-radius: 8px; background: #f7faf8; }
.login-org span { color: var(--muted); font-size: 12px; }
.login-org strong { color: var(--text); font-size: 14px; line-height: 1.45; }
.login-submit { width: 100%; margin-top: 22px; }

.app-shell { display: flex; min-height: 100vh; }
.sidebar { position: sticky; top: 0; width: 256px; min-width: 256px; max-width: 256px; height: 100vh; flex: 0 0 256px; box-sizing: border-box; overflow-y: auto; overflow-x: hidden; scrollbar-gutter: stable; background: var(--nav); color: #e8edf5; border-right: 1px solid #2a6968; }
.brand { min-height: 72px; padding: 17px 18px 13px; border-bottom: 1px solid #2a6968; }
.menu { padding: 10px; }
.menu-group + .menu-group { margin-top: 3px; }
.menu-title, .submenu-item { width: 100%; min-height: 38px; border: 0; color: inherit; text-align: left; }
.menu-title { display: grid; grid-template-columns: 20px minmax(0,1fr) 16px; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; background: transparent; }
.menu-title svg, .icon-button svg, .primary-button svg, .ghost-button svg { width: 18px; height: 18px; flex: 0 0 auto; }
.menu-title:hover, .menu-title.is-active { background: var(--nav-soft); }
.menu-title.is-active { color: #fff; }
.chevron { transition: transform .24s cubic-bezier(.2,.8,.2,1); }
.menu-group.is-open .chevron { transform: rotate(180deg); }
.submenu {
  display: grid;
  grid-template-rows: 0fr;
  padding-left: 42px;
  overflow: hidden;
  opacity: 0;
  transform: translateY(-3px);
  pointer-events: none;
  transition: grid-template-rows .32s cubic-bezier(.22,1,.36,1), opacity .18s ease, transform .26s cubic-bezier(.22,1,.36,1);
  will-change: grid-template-rows, opacity, transform;
}
.submenu-inner {
  display: grid;
  gap: 2px;
  min-height: 0;
  overflow: hidden;
  padding: 0 0 0;
  transition: padding .28s cubic-bezier(.22,1,.36,1);
}
.menu-group.is-open .submenu {
  grid-template-rows: 1fr;
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.menu-group.is-open .submenu-inner { padding: 3px 0 7px; }
.submenu-item { padding: 7px 9px; border-radius: 6px; background: transparent; color: #bdd2d2; font-size: 13px; transition: background-color .18s ease, color .18s ease, transform .18s ease; }
.submenu-item:hover, .submenu-item.is-active { background: rgba(255,255,255,.09); color: #fff; }
.submenu-item:hover { transform: translateX(2px); }

.content { --content-inline-padding: 22px; width: calc(100% - 256px); min-width: 0; padding: 0 var(--content-inline-padding) 28px; }
.topbar { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 16px; min-height: 72px; margin: 0 calc(var(--content-inline-padding) * -1); padding: 14px var(--content-inline-padding) 12px; border-bottom: 1px solid rgba(207, 224, 221, .86); background: rgba(246, 249, 248, .96); box-shadow: 0 10px 24px rgba(24, 60, 63, .06); backdrop-filter: blur(12px); }
.title-block { min-width: 0; margin-right: auto; }
.breadcrumb-line { display: inline-flex; align-items: center; min-width: 0; gap: 9px; color: var(--muted); }
.home-mark { display: inline-grid; place-items: center; flex: 0 0 auto; width: 28px; height: 28px; padding: 0; border: 1px solid #c9dfdc; border-radius: 8px; background: #f6fbfa; color: var(--brand); font: inherit; cursor: pointer; }
.home-mark:hover { border-color: rgba(15,118,110,.45); background: #eef7f5; }
.home-mark:focus-visible { outline: 2px solid rgba(15,118,110,.24); outline-offset: 2px; }
.home-mark svg { width: 17px; height: 17px; }
.breadcrumb-separator { align-self: center; color: #7f9399; font-size: 18px; font-weight: 700; line-height: 1; padding-bottom: 0; }
.breadcrumb { display: block; color: var(--muted); font-size: 12px; }
h1 { margin-top: 4px; font-size: 23px; line-height: 1.2; }
.title-block h1 { align-self: center; margin: 0; color: var(--text); font-size: 20px; font-weight: 850; line-height: 1; letter-spacing: 0; padding-bottom: 0; }
.title-block .breadcrumb { align-self: center; color: var(--muted-strong); font-size: 16px; font-weight: 800; line-height: 1; letter-spacing: 0; padding-bottom: 0; }
.topbar-actions { display: flex; align-items: center; gap: 9px; }
.identity-chip { display: grid; min-width: 144px; gap: 2px; min-height: 38px; padding: 5px 12px; border: 1px solid #cfe3e0; border-radius: 8px; background: #f4fbfa; }
.identity-chip span { color: var(--brand); font-size: 12px; }
.identity-chip strong { font-size: 13px; }
.message-area { position: relative; }
.message-button { position: relative; }
.message-badge { position: absolute; top: -6px; right: -5px; min-width: 18px; height: 18px; padding: 0 5px; border: 2px solid #fff; border-radius: 999px; background: var(--red); color: #fff; font-size: 11px; line-height: 14px; }
.message-badge.is-zero { display: none; }
.message-panel { position: absolute; top: 46px; right: 0; z-index: 25; width: min(360px, calc(100vw - 32px)); border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: var(--shadow); }
.message-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px; border-bottom: 1px solid var(--line); }
.message-header h2 { margin-top: 4px; font-size: 18px; }
.message-list { display: grid; padding: 4px 0; }
.message-item { display: grid; gap: 4px; padding: 11px 14px; border-bottom: 1px solid #eef1f5; }
.message-item:last-child { border-bottom: 0; }
.message-item strong { font-size: 14px; }
.message-item span { color: var(--muted); font-size: 12px; line-height: 1.5; }
.message-item[data-unread="true"] strong::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--red); vertical-align: middle; }

.filter-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-top: 12px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.select-wrap, .date-range, .filter-meta { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--muted); font-size: 13px; }
.filter-meta { margin-left: auto; border-color: #cfe3e0; background: #f4fbfa; }
.filter-meta strong { color: var(--brand); font-size: 13px; }
select { min-width: 78px; border: 0; outline: 0; background: transparent; color: var(--text); }
.range-separator { color: var(--muted); }
.primary-button, .ghost-button, .icon-button { display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; }
.primary-button, .ghost-button { gap: 8px; min-height: 38px; padding: 0 13px; }
.primary-button { border: 1px solid var(--brand); background: var(--brand); color: #fff; }
.primary-button:hover { background: #0c625c; }
.ghost-button { border: 1px solid var(--line); background: var(--surface); color: var(--text); }
.ghost-button.compact { min-height: 30px; padding: 0 10px; font-size: 12px; }
.ghost-button.is-on { border-color: #f0b8b4; background: #fff5f4; color: var(--red); }
.icon-button { width: 38px; height: 38px; border: 1px solid var(--line); background: var(--surface); color: var(--text); }
.mobile-menu { display: none; }

.summary-band { display: grid; grid-template-columns: 1fr; align-items: center; margin-top: 10px; padding: 0; border: 0; background: transparent; }
.status-row { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; }
.status-pill, .mini-badge, .risk-badge { display: inline-flex; align-items: center; min-height: 26px; padding: 3px 9px; border-radius: 999px; background: #e9f6ef; color: var(--green); font-size: 12px; white-space: nowrap; }
.status-pill.muted { background: #eef3f5; color: var(--muted-strong); }
.status-pill strong { margin-left: 4px; }
.decision-card { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: start; width: 100%; gap: 7px 12px; padding: 12px 14px; border: 1px solid #cfe3e0; border-left: 4px solid var(--brand); border-radius: 8px; background: linear-gradient(90deg, #fff, #f6fbfa); box-shadow: 0 10px 24px rgba(20,60,63,.05); }
.decision-card span { display: inline-flex; align-items: center; justify-content: center; min-height: 24px; padding: 0 8px; border-radius: 999px; background: #e9f6ef; color: var(--brand); font-size: 13px; font-weight: 800; white-space: nowrap; }
.decision-card strong { color: #0b4f4a; font-size: 16px; line-height: 1.35; }
.decision-card p { grid-column: 2; margin: 0; color: var(--muted-strong); font-size: 13px; line-height: 1.55; max-width: none; }
.conclusion-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin-top: 12px; }
.conclusion-card { min-height: 104px; padding: 13px 14px; border: 1px solid var(--line); border-top: 3px solid var(--brand); border-radius: 8px; background: var(--surface); }
.conclusion-card span { display: block; color: var(--muted); font-size: 12px; }
.conclusion-card strong { display: block; margin-top: 7px; font-size: 24px; line-height: 1.1; }
.conclusion-card p { margin-top: 8px; color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.conclusion-card.red { border-top-color: var(--red); }
.conclusion-card.amber { border-top-color: var(--amber); }
.conclusion-card.green { border-top-color: var(--green); }
.conclusion-card.blue { border-top-color: var(--brand-2); }

.kpi-grid { display: grid; grid-template-columns: repeat(6, minmax(138px,1fr)); gap: 10px; margin-top: 12px; }
.kpi-card { display: grid; grid-template-columns: 38px minmax(0,1fr); grid-template-rows: auto auto auto; min-height: 112px; padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--text); text-align: left; transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
.kpi-card:hover, .kpi-card.is-selected { border-color: #93b4b7; box-shadow: 0 10px 24px rgba(20,60,63,.08); transform: translateY(-1px); }
.kpi-card.is-selected { border-top: 3px solid var(--brand); }
.kpi-card.is-pulse { animation: pulse-card .52s ease; }
@keyframes pulse-card { 0% { box-shadow: 0 0 0 rgba(15,118,110,0); } 50% { box-shadow: 0 0 0 4px rgba(15,118,110,.16); } 100% { box-shadow: 0 0 0 rgba(15,118,110,0); } }
.kpi-icon { display: grid; grid-row: 1 / span 3; place-items: center; width: 31px; height: 31px; border-radius: 8px; }
.kpi-icon.blue { background: #e6f1f4; color: var(--brand-2); }
.kpi-icon.teal { background: #e3f5f3; color: var(--brand); }
.kpi-icon.green { background: #e8f5ee; color: var(--green); }
.kpi-icon.red { background: #fff1ef; color: var(--red); }
.kpi-icon.amber { background: var(--gold-soft); color: var(--amber); }
.kpi-icon.slate { background: #eef2f6; color: var(--slate); }
.kpi-label { color: var(--muted); font-size: 12px; }
.kpi-card strong { margin-top: 7px; font-size: 22px; line-height: 1.15; overflow-wrap: anywhere; }
.kpi-delta { margin-top: 7px; color: var(--muted); font-size: 12px; }
.kpi-delta.up { color: var(--green); }
.kpi-delta.down { color: var(--red); }
.kpi-delta.warn { color: var(--amber); }

.ops-grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(260px,.82fr) minmax(260px,.82fr); gap: 12px; margin-top: 12px; }
.panel { min-width: 0; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.panel-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 15px 16px 0; }
.panel-header.compact { align-items: center; }
.panel h3 { font-size: 16px; line-height: 1.25; }
.panel p { margin-top: 5px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.ai-actions { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 9px; padding: 13px 16px 16px; }
.ai-action { display: grid; gap: 6px; min-height: 104px; padding: 12px; border: 1px solid #d8e5e8; border-radius: 8px; background: #f8fcfb; color: var(--text); text-align: left; }
.ai-action:hover { border-color: var(--brand); }
.ai-action span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: #e3f5f3; color: var(--brand); }
.ai-action strong { font-size: 14px; }
.ai-action em { color: var(--muted); font-size: 12px; font-style: normal; line-height: 1.4; }
.shortcut-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; padding: 13px 16px 16px; }
.shortcut-item { display: flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 11px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); text-align: left; }
.shortcut-item:hover { border-color: var(--brand); color: var(--brand); }
.health-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; padding: 13px 16px 16px; }
.health-item { display: grid; gap: 4px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.health-item span { color: var(--muted); font-size: 12px; }
.health-item strong { font-size: 22px; }
.health-item em { color: var(--muted-strong); font-size: 12px; font-style: normal; }

.dashboard-grid { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(300px,.75fr); gap: 12px; margin-top: 12px; }
.tabs { display: inline-flex; padding: 3px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.tab { min-width: 58px; min-height: 30px; border: 0; border-radius: 6px; background: transparent; color: var(--muted-strong); font-size: 13px; }
.tab.is-active { background: var(--surface); box-shadow: 0 1px 5px rgba(20,60,63,.12); color: var(--text); }
.chart-wrap { height: 294px; padding: 4px 12px 12px; }
#trendChart { width: 100%; height: 100%; overflow: visible; }
.chart-axis { stroke: #d6dce5; stroke-width: 1; }
.chart-grid { stroke: #e8ecf1; stroke-width: 1; }
.chart-label { fill: #667085; font-size: 12px; }
.chart-area { opacity: .14; }
.chart-line { fill: none; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.chart-dot { stroke: #fff; stroke-width: 3; }
.chart-bar { rx: 4px; }
.focus-panel { min-height: 260px; }
.focus-content { padding: 13px 16px 16px; }
.focus-content strong { font-size: 30px; }
.focus-content p { margin-top: 8px; color: var(--muted-strong); }
.stack-bars { display: grid; gap: 9px; margin-top: 15px; }
.stack-row { display: grid; grid-template-columns: 76px minmax(0,1fr) 36px; align-items: center; gap: 9px; color: var(--muted-strong); font-size: 12px; }
.bar-track { height: 9px; overflow: hidden; border-radius: 999px; background: #e9edf2; }
.bar-fill { height: 100%; border-radius: inherit; background: var(--brand); }
.mix-list { display: grid; gap: 11px; padding: 14px 16px 16px; }
.mix-row { display: grid; grid-template-columns: minmax(160px,.8fr) minmax(0,1fr) 42px; align-items: center; gap: 10px; }
.mix-row strong, .mix-row span { display: block; }
.mix-row strong { font-size: 13px; }
.mix-row span { margin-top: 3px; color: var(--muted); font-size: 12px; }
.mix-row em { color: var(--muted-strong); font-style: normal; font-size: 12px; text-align: right; }
.action-list { display: grid; gap: 10px; padding: 14px 16px 16px; }
.action-item { display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 10px; align-items: start; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.action-item > span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #e3f5f3; color: var(--brand); font-size: 12px; font-weight: 700; }
.action-item strong { font-size: 13px; }
.action-item p { margin-top: 3px; }
.anomaly-panel { grid-column: 1 / -1; min-height: 330px; }
.table-wrap { overflow-x: auto; padding: 10px 16px 16px; }
table { width: 100%; min-width: 720px; border-collapse: collapse; }
th, td { padding: 10px 9px; border-bottom: 1px solid #edf0f4; text-align: left; vertical-align: middle; font-size: 13px; }
th { color: var(--muted); font-weight: 600; }
td strong, td span { display: block; }
td span { margin-top: 4px; color: var(--muted); font-size: 12px; }
.risk-badge { width: fit-content; max-width: 260px; border-radius: 6px; background: #edf5ff; color: var(--brand-2); white-space: normal; }
.risk-badge.high { background: #fff1ef; color: var(--red); }
.risk-badge.medium { background: var(--gold-soft); color: var(--amber); }
.row-action { min-height: 30px; padding: 0 10px; border: 1px solid var(--line); border-radius: 6px; background: #fff; color: var(--text); font-size: 12px; }
.row-action:hover { border-color: var(--brand); }

.drawer-backdrop, .modal-backdrop { position: fixed; inset: 0; z-index: 30; background: rgba(20,60,63,.42); }
.drawer, .brief-modal { position: fixed; z-index: 40; border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow); }
.drawer { top: 0; right: 0; width: min(460px,100vw); height: 100vh; transform: translateX(105%); transition: transform .22s ease; }
.drawer.is-open { transform: translateX(0); }
.drawer-header, .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 20px; border-bottom: 1px solid var(--line); }
.drawer-header h2, .modal-header h2 { margin-top: 5px; font-size: 21px; }
.drawer-body { display: grid; gap: 20px; padding: 20px; }
.diagnosis-score { display: flex; align-items: center; justify-content: space-between; min-height: 82px; padding: 16px; border: 1px solid #ffd4d4; border-radius: 8px; background: #fff7f7; color: var(--red); }
.diagnosis-score span { color: var(--muted-strong); }
.diagnosis-score strong { font-size: 42px; line-height: 1; }
.drawer-body h3 { margin-bottom: 8px; font-size: 15px; }
.drawer-body p, .drawer-body li { color: var(--muted-strong); line-height: 1.7; font-size: 14px; }
.drawer-body ul { display: grid; gap: 8px; margin: 0; padding-left: 18px; }
.brief-modal { left: 50%; top: 50%; width: min(620px, calc(100vw - 32px)); max-height: calc(100vh - 48px); overflow-y: auto; border-radius: 8px; transform: translate(-50%,-46%) scale(.98); opacity: 0; pointer-events: none; transition: opacity .18s ease, transform .18s ease; }
.brief-modal.is-open { transform: translate(-50%,-50%) scale(1); opacity: 1; pointer-events: auto; }
.brief-content { display: grid; gap: 12px; padding: 18px 20px 22px; }
.brief-line { padding: 12px 14px; border-left: 4px solid var(--brand); border-radius: 8px; background: var(--surface-soft); color: var(--muted-strong); line-height: 1.65; }
.toast { position: fixed; right: 20px; bottom: 20px; z-index: 50; max-width: min(360px, calc(100vw - 40px)); padding: 12px 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--nav); color: #fff; box-shadow: var(--shadow); transform: translateY(20px); opacity: 0; pointer-events: none; transition: opacity .18s ease, transform .18s ease; }
.toast.is-visible { transform: translateY(0); opacity: 1; }

@media (max-width: 1360px) {
  .kpi-grid { grid-template-columns: repeat(3, minmax(170px,1fr)); }
  .ops-grid { grid-template-columns: 1fr; }
  .ai-actions { grid-template-columns: repeat(4, minmax(0,1fr)); }
}
@media (max-width: 1180px) {
  .login-screen { grid-template-columns: 1fr; background: linear-gradient(135deg, #0b2f32, #16484a 48%, #edf3f1 48%); }
  .login-aside { min-height: auto; padding: 32px; }
  .login-panel { padding: 32px; }
  .summary-band, .dashboard-grid { grid-template-columns: 1fr; }
  .decision-card { grid-template-columns: 1fr; }
  .decision-card p { grid-column: 1; }
  .draft-status-row { justify-content: flex-start; }
  .conclusion-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .sidebar { position: fixed; z-index: 35; transform: translateX(-100%); transition: transform .22s ease; }
  .sidebar.is-open { transform: translateX(0); }
  .content { --content-inline-padding: 16px; width: 100%; padding: 0 var(--content-inline-padding) 24px; }
  .mobile-menu { display: inline-flex; }
  .topbar { align-items: flex-start; }
  .topbar-actions { flex-wrap: wrap; justify-content: flex-end; }
  .message-panel { right: -48px; }
}
@media (max-width: 680px) {
  .login-screen { display: block; }
  .login-copy h1 { font-size: 30px; }
  .login-stats, .ai-actions, .shortcut-grid, .health-list, .conclusion-grid { grid-template-columns: 1fr; }
  .login-panel { padding: 16px; }
  .topbar { display: grid; grid-template-columns: auto minmax(0,1fr); }
  .topbar-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .filter-strip, .select-wrap, .date-range, .filter-meta, .primary-button, .ghost-button { width: 100%; }
  .filter-meta { margin-left: 0; }
  .date-range { flex-wrap: wrap; padding: 8px 10px; }
  .date-range label, .date-range input { width: 100%; }
  .range-separator { display: none; }
  .kpi-grid { grid-template-columns: 1fr; }
  .panel-header { display: grid; }
  .tabs { width: 100%; }
  .tab { flex: 1 1 0; }
  .mix-row { grid-template-columns: 1fr; }
  .mix-row em { text-align: left; }
}
.view-panel[hidden] { display: none !important; }
.view-panel.is-active { display: block; }
.draft-status-row { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.draft-status-row .status-pill strong { margin-left: 4px; }
.draft-layout { display: grid; grid-template-columns: repeat(12, minmax(0,1fr)); gap: 10px; margin-top: 10px; align-items: stretch; }
.prompt-panel { grid-column: span 7; }
.prompt-panel, .business-panel, .template-panel, .clause-panel { display: flex; flex-direction: column; height: 100%; }
.business-panel { grid-column: span 5; }
.template-panel, .clause-panel { grid-column: span 6; }
.preview-panel { grid-column: span 8; }
.generation-panel { grid-column: span 4; }
.prompt-body { display: grid; grid-template-rows: auto minmax(118px,1fr) auto auto auto; flex: 1 1 auto; gap: 10px; padding: 12px 14px 14px; }
.prompt-body textarea { width: 100%; min-height: 118px; resize: vertical; padding: 13px; border: 1px solid var(--line); border-radius: 8px; outline: 0; color: var(--text); line-height: 1.65; }
.prompt-body textarea:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(15,118,110,.12); }
.prompt-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.preview-header { align-items: stretch; }
.preview-title { min-width: 220px; }
.draft-tools { display: grid; gap: 8px; justify-items: end; }
.tool-group { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.compact-tool { min-height: 34px; padding: 0 10px; font-size: 12px; }
.business-form { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; padding: 12px 14px 14px; }
.business-form label { display: grid; gap: 6px; color: var(--muted-strong); font-size: 12px; }
.business-form label.wide { grid-column: 1 / -1; }
.business-form input, .business-form select { height: 36px; width: 100%; border: 1px solid var(--line); border-radius: 8px; background: #fff; padding: 0 10px; outline: 0; }
.business-form input:focus, .business-form select:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(15,118,110,.12); }
.business-insights { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); flex: 1 1 auto; gap: 8px; padding: 0 14px 14px; }
.business-insights div { min-height: 58px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.business-insights span, .business-insights strong { display: block; }
.business-insights span { color: var(--muted); font-size: 12px; }
.business-insights strong { margin-top: 5px; font-size: 13px; line-height: 1.35; }
.business-insights em { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; font-style: normal; line-height: 1.35; }
.business-insight-card { overflow: hidden; }
.mini-progress { height: 5px; margin-top: 7px; overflow: hidden; border-radius: 999px; background: #e4eceb; }
.mini-progress b { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--brand), var(--brand-2)); transition: width .35s ease; }
.template-list, .clause-list, .generation-steps { display: grid; gap: 8px; padding: 12px 14px 14px; }
.template-list, .clause-list { flex: 1 1 auto; align-content: stretch; }
.template-list .template-item, .clause-list .clause-item { height: 100%; }
.history-box > #historyList { display: grid; gap: 8px; max-height: 548px; overflow-y: auto; padding: 10px 12px; padding-right: 8px; scrollbar-width: thin; }
.history-box > #historyList::-webkit-scrollbar { width: 6px; }
.history-box > #historyList::-webkit-scrollbar-thumb { border-radius: 999px; background: #c7d7d9; }
.template-item { display: grid; gap: 5px; width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); text-align: left; }
.template-item.is-active { border-color: var(--brand); background: #f4fbfa; box-shadow: inset 3px 0 0 var(--brand); }
.template-item strong, .clause-item strong, .history-item strong { font-size: 13px; }
.template-item span, .clause-item p, .history-item p { color: var(--muted); font-size: 12px; line-height: 1.45; }
.history-item p { display: -webkit-box; min-height: 34px; margin: 0; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; color: #344054; font-size: 12.5px; font-weight: 600; line-height: 1.38; }
.template-item em { color: var(--brand); font-size: 12px; font-style: normal; }
.clause-item { display: grid; gap: 6px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.clause-item div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.clause-item span { min-width: fit-content; padding: 3px 8px; border-radius: 999px; background: #e9f6ef; color: var(--green); font-size: 12px; }
.preview-panel, .generation-panel { min-height: 0; scroll-margin-top: 18px; }
.draft-preview { margin: 10px 16px 16px; padding: 18px 20px; min-height: 460px; overflow: auto; border: 1px solid #dce3e6; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.8); }
.preview-panel.is-focus-jump { animation: previewFocusPulse 1.5s ease; }
.preview-panel.is-focus-jump .draft-preview { border-color: var(--brand); box-shadow: 0 0 0 4px rgba(15,118,110,.14), inset 0 0 0 1px rgba(255,255,255,.8); }
@keyframes previewFocusPulse {
  0% { outline: 0 solid rgba(15,118,110,0); outline-offset: 0; }
  22% { outline: 4px solid rgba(15,118,110,.18); outline-offset: 3px; }
  100% { outline: 0 solid rgba(15,118,110,0); outline-offset: 8px; }
}
.draft-doc-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid #edf0f4; }
.draft-doc-head span { color: var(--muted); font-size: 12px; }
.draft-doc-head strong { font-size: 20px; }
.draft-preview h4 { margin: 16px 0 6px; font-size: 15px; }
.draft-preview p { margin-top: 8px; color: var(--muted-strong); font-size: 14px; line-height: 1.8; }
.generation-step { display: grid; grid-template-columns: 24px minmax(0,1fr); gap: 8px; align-items: start; padding: 8px 9px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.generation-step > span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #e6f1f4; color: var(--brand-2); font-size: 12px; font-weight: 700; }
.generation-step strong { font-size: 13px; }
.generation-step p { margin-top: 2px; line-height: 1.42; }
.history-box { margin: 0 12px 12px; border-top: 1px solid var(--line); }
.history-box-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 0 0; }
.history-box-head h4 { margin: 0; font-size: 14px; }
.history-box-head span { color: var(--muted); font-size: 12px; }
.history-item { display: grid; grid-template-rows: auto minmax(34px, auto) auto; align-content: start; gap: 6px; width: 100%; min-height: 98px; padding: 10px; border: 1px solid var(--line); border-left: 3px solid var(--brand-2); border-radius: 8px; background: #fff; color: var(--text); text-align: left; }
.history-item:hover, .history-item.is-active { border-color: var(--brand); background: #f4fbfa; box-shadow: inset 2px 0 0 var(--brand); }
.history-item div, .history-item footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 16px; }
.history-item span { min-width: fit-content; color: var(--brand); font-size: 12px; }
.history-item em { color: var(--muted); font-size: 11px; font-style: normal; }
.history-detail { display: grid; gap: 7px; margin: 0 12px 10px; padding: 10px; border: 1px solid #d8e6df; border-radius: 8px; background: #f7faf8; }
.history-detail div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.history-detail strong { font-size: 13px; }
.history-detail p { color: var(--muted-strong); font-size: 12px; line-height: 1.5; }
.history-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.history-tags span { padding: 3px 7px; border-radius: 999px; background: #eef6f7; color: var(--brand-2); font-size: 11px; }
.history-actions { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; padding: 0 12px 12px; }
.history-actions .ghost-button, .history-actions .primary-button { justify-content: center; width: 100%; }
@media (min-width: 1281px) {
  .preview-panel, .generation-panel { display: flex; flex-direction: column; height: 940px; align-self: start; }
  .preview-panel > .panel-header, .generation-panel > .panel-header, .preview-metrics, .generation-steps { flex: 0 0 auto; }
  .preview-panel .draft-preview { flex: 1 1 auto; min-height: 0; }
  .generation-panel .history-box { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
  .generation-panel .history-detail, .generation-panel .history-actions { flex: 0 0 auto; }
}

@media (max-width: 1180px) {
  .draft-layout { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .business-form, .business-insights, .history-actions { grid-template-columns: 1fr; }
  .draft-doc-head { align-items: flex-start; flex-direction: column; }
  .draft-preview { margin: 12px; padding: 16px; min-height: 360px; }
}
.prompt-preset-list { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 9px; }
.prompt-preset { display: grid; gap: 5px; min-height: 72px; padding: 10px 11px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); text-align: left; }
.prompt-preset.is-active, .prompt-preset:hover { border-color: var(--brand); background: #f4fbfa; }
.prompt-preset strong { font-size: 13px; }
.prompt-preset span { color: var(--muted); font-size: 12px; line-height: 1.4; }
.prompt-analysis { display: grid; gap: 10px; padding: 12px; border: 1px solid #d8e6df; border-radius: 8px; background: #f7faf8; }
.analysis-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.analysis-title strong { font-size: 13px; }
.analysis-title span { color: var(--brand); font-size: 12px; }
.analysis-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.analysis-grid div { min-height: 58px; padding: 9px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.analysis-grid span, .analysis-grid strong { display: block; }
.analysis-grid span { color: var(--muted); font-size: 12px; }
.analysis-grid strong { margin-top: 5px; font-size: 12px; line-height: 1.35; overflow-wrap: anywhere; }
.prompt-analysis p { color: var(--amber); font-size: 12px; line-height: 1.45; }
.template-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.template-meta em { padding: 3px 7px; border-radius: 999px; background: #eef3f5; color: var(--muted-strong); }
.template-detail { display: grid; gap: 9px; margin: 0 16px 16px; padding: 12px; border: 1px solid #d8e6df; border-radius: 8px; background: #f7faf8; }
.template-detail-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.template-detail-head strong { font-size: 13px; }
.template-detail-head span { color: var(--brand); font-weight: 700; }
.template-detail p { color: var(--muted-strong); font-size: 12px; line-height: 1.5; }
.template-section-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.template-section-tags span { padding: 4px 8px; border-radius: 999px; background: #e6f1f4; color: var(--brand-2); font-size: 12px; }
.template-risk { display: grid; gap: 4px; padding-top: 8px; border-top: 1px solid var(--line); }
.template-risk strong { color: var(--amber); font-size: 12px; }
.template-risk span { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.clause-item em { display: block; margin-top: 2px; padding: 8px; border-radius: 6px; background: #fff; color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.5; }
.generated-summary { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; }
.generated-summary span { padding: 5px 9px; border-radius: 999px; background: #eef6f7; color: var(--brand-2); font-size: 12px; }
.draft-meta-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; margin: 12px 0; }
.draft-meta-grid div { padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.draft-meta-grid span, .draft-meta-grid strong { display: block; }
.draft-meta-grid span { color: var(--muted); font-size: 12px; }
.draft-meta-grid strong { margin-top: 5px; font-size: 13px; line-height: 1.4; }
.preview-backdrop { position: fixed; inset: 0; z-index: 55; background: rgba(20,60,63,.48); }
.preview-modal { position: fixed; inset: 24px; z-index: 60; display: grid; grid-template-rows: auto minmax(0,1fr); border: 1px solid var(--line); border-radius: 8px; background: #f6f8f8; box-shadow: var(--shadow); transform: scale(.98); opacity: 0; pointer-events: none; transition: opacity .18s ease, transform .18s ease; }
.preview-modal.is-open { transform: scale(1); opacity: 1; pointer-events: auto; }
.preview-modal-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 18px; border-bottom: 1px solid var(--line); background: #fff; }
.preview-modal-header h2 { margin-top: 4px; font-size: 20px; }
.preview-modal-body { overflow: auto; width: min(920px, calc(100% - 36px)); margin: 18px auto; padding: 28px 34px; border: 1px solid #dce3e6; border-radius: 8px; background: #fff; }
.preview-modal-body h4 { margin: 18px 0 6px; font-size: 15px; }
.preview-modal-body p { margin-top: 8px; color: var(--muted-strong); font-size: 14px; line-height: 1.85; }
.preview-modal-body .draft-doc-head { margin-bottom: 14px; }

@media (max-width: 900px) {
  .prompt-preset-list, .analysis-grid, .draft-meta-grid { grid-template-columns: 1fr; }
  .preview-modal { inset: 10px; }
  .preview-modal-body { width: calc(100% - 20px); margin: 10px; padding: 18px; }
}
.empty-preview { min-height: 220px; display: grid; place-items: center; align-content: center; gap: 10px; color: var(--muted); text-align: center; }
.empty-preview i { width: 34px; height: 34px; color: var(--brand-2); }
.empty-preview strong { color: var(--text); font-size: 16px; }
.empty-preview span { max-width: 360px; font-size: 13px; line-height: 1.6; }
.empty-analysis { display: grid; gap: 5px; padding: 10px; border: 1px dashed var(--line-strong); border-radius: 8px; background: #fff; }
.empty-analysis strong { font-size: 13px; color: var(--text); }
.empty-analysis span { color: var(--muted); font-size: 12px; line-height: 1.5; }
.draft-doc-head.formal { display: grid; justify-items: center; gap: 6px; text-align: center; }
.draft-doc-head.formal strong { font-size: 24px; letter-spacing: 0; }
.draft-doc-head.formal em { color: var(--muted); font-size: 12px; font-style: normal; }
.formal-intro { padding: 10px 0; border-top: 1px solid #edf0f4; border-bottom: 1px solid #edf0f4; }
.signature-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; margin-top: 26px; padding-top: 18px; border-top: 1px solid #edf0f4; }
.signature-grid div { display: grid; gap: 14px; min-height: 116px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; }
.signature-grid strong, .signature-grid span { display: block; }
.history-backdrop { position: fixed; inset: 0; z-index: 55; background: rgba(20,60,63,.42); }
.history-modal { position: fixed; top: 50%; left: 50%; z-index: 60; width: min(560px, calc(100vw - 32px)); max-height: calc(100vh - 48px); display: grid; grid-template-rows: auto minmax(0,1fr); border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: var(--shadow); transform: translate(-50%,-46%) scale(.98); opacity: 0; pointer-events: none; transition: opacity .18s ease, transform .18s ease; }
.history-modal.is-open { transform: translate(-50%,-50%) scale(1); opacity: 1; pointer-events: auto; }
.history-modal-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 18px; border-bottom: 1px solid var(--line); }
.history-modal-header h2 { margin-top: 4px; font-size: 20px; }
.history-modal-body { overflow-y: auto; display: grid; gap: 10px; padding: 14px 16px 16px; }
.draft-history-item { display: grid; gap: 5px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); color: var(--text); text-align: left; }
.draft-history-item:hover { border-color: var(--brand); background: #f4fbfa; }
.draft-history-item strong { font-size: 14px; }
.draft-history-item span, .draft-history-item em { color: var(--muted); font-size: 12px; font-style: normal; }
.empty-history { min-height: 160px; display: grid; place-items: center; align-content: center; gap: 6px; color: var(--muted); text-align: center; }
.empty-history strong { color: var(--text); }

@media (max-width: 680px) {
  .signature-grid { grid-template-columns: 1fr; }
}
.preview-metrics { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; padding: 12px 16px 0; }
.preview-metrics div { min-height: 58px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.preview-metrics span, .preview-metrics strong { display: block; }
.preview-metrics span { color: var(--muted); font-size: 12px; }
.preview-metrics strong { margin-top: 5px; font-size: 13px; line-height: 1.35; }
.template-topline { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.template-topline span { min-width: fit-content; padding: 3px 7px; border-radius: 999px; background: #e9f6ef; color: var(--green); font-size: 12px; }
.template-item p { margin: 0; color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
@media (max-width: 1280px) {
  .prompt-panel, .business-panel, .template-panel, .clause-panel, .preview-panel, .generation-panel { grid-column: 1 / -1; }
  .preview-metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 680px) {
  .draft-tools { justify-items: stretch; }
  .tool-group { justify-content: stretch; }
  .tool-group .primary-button, .tool-group .ghost-button { flex: 1 1 0; }
  .preview-metrics { grid-template-columns: 1fr; }
}
.login-stats button { min-height: 76px; padding: 13px; border: 1px solid rgba(255,226,160,.3); border-radius: 8px; background: rgba(7,34,36,.68); box-shadow: 0 10px 24px rgba(0,0,0,.14); color: inherit; text-align: left; }
.login-stats button:hover { border-color: rgba(255,226,160,.72); background: rgba(7,34,36,.82); }
.login-stats em { display: block; margin-top: 5px; color: rgba(255,255,255,.74); font-size: 11px; font-style: normal; line-height: 1.35; }
.login-field select, .password-wrap input, .global-search input, .table-tools input { height: 38px; border: 1px solid var(--line); border-radius: 8px; background: #fff; padding: 0 11px; outline: 0; color: var(--text); }
.login-field select:focus, .password-wrap input:focus, .global-search input:focus, .table-tools input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(15,118,110,.12); }
.password-wrap { display: grid; grid-template-columns: minmax(0,1fr) 38px; gap: 8px; }
.password-toggle { width: 38px; }
.login-options { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; color: var(--muted-strong); font-size: 12px; }
.login-options label { display: inline-flex; align-items: center; gap: 6px; }
.login-options button { border: 0; background: transparent; color: var(--brand); }
.login-error { min-height: 18px; margin-top: 9px; color: var(--red); font-size: 12px; }
.login-submit.is-loading { opacity: .78; cursor: wait; }
.global-search { display: inline-flex; align-items: center; gap: 7px; min-height: 38px; padding: 0 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.global-search input { width: 180px; height: 28px; border: 0; padding: 0; box-shadow: none; }
.submenu-item.is-disabled, .shortcut-item.is-disabled { opacity: .55; border-style: dashed; cursor: not-allowed; }
.submenu-item em, .shortcut-item em { margin-left: auto; color: var(--muted); font-size: 11px; font-style: normal; }
.shortcut-item.is-disabled:hover { border-color: var(--line); color: var(--text); }
.health-item { text-align: left; cursor: pointer; }
.health-item:hover { border-color: var(--brand); background: #f4fbfa; }
.message-main { display: grid; gap: 4px; width: 100%; border: 0; background: transparent; color: inherit; text-align: left; }
.message-actions { display: flex; gap: 8px; margin-top: 6px; }
.message-actions button { min-height: 24px; border: 0; background: transparent; color: var(--brand); font-size: 12px; }
.table-tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 16px 0; }
.table-tools label { display: inline-flex; align-items: center; gap: 7px; min-height: 38px; padding: 0 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.table-tools input { width: min(300px, 52vw); height: 28px; border: 0; padding: 0; box-shadow: none; }
.table-tools div { display: flex; flex-wrap: wrap; gap: 8px; }
.table-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 0 16px 16px; color: var(--muted); font-size: 12px; }
.table-empty { padding: 18px; color: var(--muted); text-align: center; }
.prompt-counter { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: -4px; color: var(--muted); font-size: 12px; }
.prompt-counter em { font-style: normal; }
.prompt-counter .is-warn { color: var(--amber); font-weight: 700; }
.draft-preview[contenteditable="true"] { caret-color: var(--brand); }
.draft-preview[contenteditable="true"]:focus { outline: 3px solid rgba(15,118,110,.14); outline-offset: 2px; }
.history-reference-clause { margin-top: 14px; padding: 10px 12px; border: 1px solid #d8e6df; border-left: 4px solid var(--brand); border-radius: 8px; background: #f7faf8; }
@media print {
  body { background: #fff; }
  .sidebar, .topbar, .filter-strip, .summary-band, .dashboard-grid, .drawer-backdrop, .drawer, .brief-modal, .toast, .preview-modal-header, .history-backdrop, .history-modal { display: none !important; }
  .content { width: 100%; padding: 0; }
  .draft-view, .preview-panel { display: block !important; }
  .draft-preview { box-shadow: none; border: 0; margin: 0; padding: 0; min-height: auto; }
}
.brief-metrics { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.brief-metrics div { padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.brief-metrics span, .brief-metrics strong { display: block; }
.brief-metrics span { color: var(--muted); font-size: 12px; }
.brief-metrics strong { margin-top: 5px; font-size: 18px; }
.brief-actions { display: flex; justify-content: flex-end; gap: 8px; }
.title-block .breadcrumb[role="button"] { cursor: pointer; }
.title-block .breadcrumb[role="button"]:hover { color: var(--brand); }
.title-block .breadcrumb[role="button"]:focus-visible { outline: 2px solid rgba(15,118,110,.24); outline-offset: 2px; border-radius: 4px; }
.preview-modal-body.has-outline { display: grid; grid-template-columns: minmax(220px,260px) minmax(0,1fr); gap: 16px; align-items: start; width: min(1160px, calc(100% - 36px)); }
.preview-outline { position: sticky; top: 0; display: grid; gap: 5px; min-width: 0; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #f7faf8; }
.preview-outline strong { font-size: 13px; }
.preview-outline button { display: block; overflow: hidden; min-width: 0; border: 0; border-radius: 6px; background: transparent; color: var(--muted-strong); text-align: left; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; line-height: 1.3; padding: 5px 6px; }
.preview-outline button:hover { color: var(--brand); background: #eef7f3; }
.preview-doc { min-width: 0; }
@media (max-width: 900px) { .preview-modal-body.has-outline { grid-template-columns: 1fr; } .preview-outline { position: static; } }
.generation-step { transition: border-color .18s ease, background .18s ease, transform .18s ease; }
.generation-step.is-active { border-color: var(--brand); background: #f4fbfa; transform: translateX(2px); }
.generation-step.is-active > span { background: var(--brand); color: #fff; }
.generation-step.is-done > span { background: var(--green); color: #fff; }
.review-hero { display: grid; grid-template-columns: minmax(0,1fr) minmax(320px,380px); gap: 10px; margin-top: 10px; padding: 11px 12px; border: 1px solid var(--line); border-left: 4px solid var(--brand); border-radius: 8px; background: linear-gradient(90deg, #fff, #f4fbfa); align-items: start; }
.review-hero h2 { margin-top: 8px; font-size: 22px; line-height: 1.25; }
.review-hero p { margin-top: 6px; color: var(--muted-strong); line-height: 1.5; }
.review-score-card { display: grid; gap: 6px; align-content: start; padding: 10px 11px; border: 1px solid #d8e6df; border-radius: 8px; background: #fff; }
.review-score-card span { color: var(--muted); font-size: 12px; }
.review-score-card strong { color: var(--brand); font-size: 24px; line-height: 1; }
.review-score-card p { margin: 0; color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.review-score-card .primary-button { color: #fff; font-weight: 700; background: #0b5f59; border-color: #0b5f59; box-shadow: 0 8px 18px rgba(11,95,89,.18); }
.review-score-card .primary-button span, .review-score-card .primary-button svg { color: #fff; }
.review-score-card .primary-button:hover { background: #084e49; border-color: #084e49; }
.review-hero-copy, .review-hero > div:first-child { display: grid; align-content: start; gap: 8px; min-width: 0; }
.review-hero-insights { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; margin-top: 0; }
.review-hero-insights div { min-height: 64px; padding: 9px 10px; border: 1px solid #d8e6df; border-radius: 8px; background: rgba(255,255,255,.82); }
.review-hero-insights span, .review-hero-insights strong, .review-hero-insights em { display: block; }
.review-hero-insights span { color: var(--muted); font-size: 12px; }
.review-hero-insights strong { margin-top: 5px; font-size: 13px; line-height: 1.35; }
.review-hero-insights em { margin-top: 4px; color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.35; }
.review-layout { display: grid; grid-template-columns: repeat(12, minmax(0,1fr)); gap: 10px; margin-top: 10px; align-items: stretch; grid-auto-flow: row dense; }
.review-upload-panel { grid-column: span 4; }
.review-config-panel { grid-column: span 8; }
.review-template-panel { grid-column: span 4; }
.review-summary-panel { grid-column: span 4; }
.review-history-panel { grid-column: span 4; }
.review-contract-panel { grid-column: span 7; }
.review-result-panel { grid-column: span 5; }
.review-basis-panel { grid-column: 1 / -1; }
.review-contract-panel, .review-result-panel, .review-basis-panel { min-height: 0; }
.review-upload-box { display: grid; justify-items: center; gap: 7px; margin: 10px 14px; padding: 14px; border: 1px dashed var(--line-strong); border-radius: 8px; background: #f8fbfb; text-align: center; }
.review-upload-box i { width: 32px; height: 32px; color: var(--brand); }
.review-upload-box span { color: var(--muted); font-size: 12px; }
.review-upload-actions, .review-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.review-field-grid, .review-setting-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; padding: 0 14px 14px; }
.review-setting-options { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; padding: 0 14px 14px; }
.review-setting-options section { display: grid; gap: 7px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.review-setting-options section > span { color: var(--muted); font-size: 12px; }
.review-option-row { display: flex; flex-wrap: wrap; gap: 6px; }
.review-choice { min-height: 30px; padding: 0 10px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--muted-strong); font-size: 12px; }
.review-choice.is-active { border-color: var(--brand); background: #e9f6ef; color: var(--brand); font-weight: 700; }
.review-field-grid div, .review-source-grid div { padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.review-field-grid span, .review-field-grid strong, .review-source-grid span, .review-source-grid strong, .review-source-grid em { display: block; }
.review-field-grid span, .review-source-grid span { color: var(--muted); font-size: 12px; }
.review-field-grid strong, .review-source-grid strong { margin-top: 5px; font-size: 13px; line-height: 1.35; }
.review-source-grid em { margin-top: 4px; color: var(--muted); font-size: 11px; font-style: normal; line-height: 1.35; }
.review-dimension-list { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 8px; padding: 12px 14px 10px; }
.review-dimension { display: grid; gap: 6px; min-height: 92px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); text-align: left; }
.review-dimension.is-active { border-color: var(--brand); background: #f4fbfa; box-shadow: inset 3px 0 0 var(--brand); }
.review-dimension div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.review-dimension strong { font-size: 13px; }
.review-dimension span, .review-dimension p { color: var(--muted); font-size: 12px; line-height: 1.4; }
.review-setting-grid label { display: grid; gap: 6px; color: var(--muted-strong); font-size: 12px; }
.review-setting-grid select { height: 36px; border: 1px solid var(--line); border-radius: 8px; background: #fff; padding: 0 10px; }
.review-contract-text { display: grid; gap: 8px; margin: 12px 14px 14px; padding: 16px 18px; border: 1px solid #dce3e6; border-radius: 8px; background: #fff; }
.review-contract-text h4 { margin-top: 8px; font-size: 14px; }
.review-contract-text p { color: var(--muted-strong); font-size: 13px; line-height: 1.75; }
.review-contract-text mark { padding: 2px 4px; border-radius: 4px; background: #fff2c2; color: #5f4100; }
.review-risk-list, .review-rule-list { display: grid; gap: 8px; padding: 12px 14px; }
.review-risk-item, .review-rule-item { display: grid; gap: 6px; width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); text-align: left; }
.review-risk-item:hover, .review-risk-item.is-active, .review-rule-item:hover, .review-rule-item.is-active { border-color: var(--brand); background: #f4fbfa; box-shadow: inset 3px 0 0 var(--brand); }
.review-risk-item div, .review-rule-item footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.review-risk-item strong, .review-rule-item strong { font-size: 13px; }
.review-risk-item p, .review-rule-item p { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.review-risk-item em, .review-rule-item span, .review-rule-item em { color: var(--muted); font-size: 11px; font-style: normal; }
.review-actions { padding: 0 14px 14px; justify-content: flex-end; }
.review-template-list, .review-history-list, .review-task-summary { display: grid; gap: 8px; padding: 12px 14px 14px; }
.review-template-item, .review-history-item { display: grid; gap: 6px; width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); text-align: left; }
.review-template-item:hover, .review-template-item.is-active, .review-history-item:hover { border-color: var(--brand); background: #f4fbfa; box-shadow: inset 3px 0 0 var(--brand); }
.review-template-item div, .review-history-item div, .review-history-item footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.review-template-item strong, .review-history-item strong { font-size: 13px; }
.review-template-item span, .review-history-item span { min-width: fit-content; color: var(--brand); font-size: 12px; font-weight: 700; }
.review-template-item p, .review-history-item p { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.review-template-item em, .review-history-item em { color: var(--muted); font-size: 11px; font-style: normal; line-height: 1.35; }
.review-task-summary .summary-main, .review-task-summary .summary-output { padding: 10px; border: 1px solid #d8e6df; border-radius: 8px; background: #f7faf8; }
.review-task-summary span, .review-task-summary strong, .review-task-summary em { display: block; }
.review-task-summary span { color: var(--muted); font-size: 12px; }
.review-task-summary strong { margin-top: 5px; font-size: 14px; line-height: 1.35; }
.review-task-summary em { margin-top: 4px; color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.35; }
.summary-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.summary-grid div { padding: 9px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.summary-output p { margin-top: 5px; color: var(--muted-strong); font-size: 12px; line-height: 1.5; }
.review-explain-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; padding: 12px 14px 10px; }
.review-explain-grid div { padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.review-explain-grid span, .review-explain-grid strong, .review-explain-grid em { display: block; }
.review-explain-grid span { color: var(--muted); font-size: 12px; }
.review-explain-grid strong { margin-top: 5px; font-size: 13px; line-height: 1.35; }
.review-explain-grid em { margin-top: 4px; color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.35; }
.review-explain-flow { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 8px; padding: 0 14px 14px; }
.review-explain-flow div { display: grid; gap: 5px; justify-items: center; min-height: 74px; padding: 10px 6px; border: 1px solid var(--line); border-radius: 8px; background: #fff; text-align: center; }
.review-explain-flow span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #e8eef0; color: var(--muted-strong); font-size: 11px; font-weight: 700; }
.review-explain-flow strong { font-size: 12px; }
.review-explain-flow em { color: var(--muted); font-size: 11px; font-style: normal; }
.review-explain-flow div.is-done { border-color: #d8e6df; background: #f7faf8; }
.review-explain-flow div.is-done span { background: var(--brand); color: #fff; }
.review-explain-flow div.is-active { border-color: var(--amber); background: #fffaf0; box-shadow: inset 0 -3px 0 var(--amber); }
.review-source-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; padding: 12px 14px 0; }
.review-basis-body { display: grid; grid-template-columns: minmax(280px,.9fr) minmax(0,1.1fr); gap: 10px; align-items: start; }
.review-rule-detail { display: grid; gap: 10px; margin: 12px 14px 14px 0; padding: 14px; border: 1px solid #d8e6df; border-radius: 8px; background: #f7faf8; }
.rule-detail-head { display: grid; gap: 5px; }
.rule-detail-head span { color: var(--brand); font-size: 12px; font-weight: 700; }
.rule-detail-head strong { font-size: 16px; }
.rule-detail-head em { color: var(--muted); font-size: 12px; font-style: normal; }
.basis-chain { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.basis-chain div { padding: 9px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.basis-chain span, .basis-chain strong { display: block; }
.basis-chain span { color: var(--muted); font-size: 12px; }
.basis-chain strong { margin-top: 5px; font-size: 12px; line-height: 1.45; }
.review-rule-detail h4 { margin-bottom: 4px; font-size: 13px; }
.review-rule-detail p { color: var(--muted-strong); font-size: 13px; line-height: 1.55; }
.review-empty { display: grid; place-items: center; align-content: center; gap: 6px; min-height: 150px; padding: 18px; color: var(--muted); text-align: center; }
.review-empty strong { color: var(--text); }
.review-empty.span-all { grid-column: 1 / -1; }
.review-view.is-launch-mode .review-result-panel { border-style: dashed; background: #fbfcfc; }
.review-view.is-launch-mode .review-actions { display: none; }
.review-view.is-launch-mode .review-contract-text { background: #fffdf7; }
.review-view.is-workspace-mode .review-result-panel { border-color: #d8e6df; box-shadow: inset 3px 0 0 var(--brand); }
@media (max-width: 1100px) { .review-upload-panel, .review-config-panel, .review-template-panel, .review-summary-panel, .review-history-panel, .review-contract-panel, .review-result-panel, .review-basis-panel, .review-explain-panel { grid-column: 1 / -1; } .review-dimension-list, .review-source-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } .review-hero { grid-template-columns: 1fr; } .review-hero-insights { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 760px) { .review-hero, .review-basis-body, .review-field-grid, .review-setting-grid, .review-setting-options, .summary-grid, .basis-chain, .review-dimension-list, .review-source-grid, .review-explain-grid, .review-explain-flow, .review-hero-insights { grid-template-columns: 1fr; } .review-rule-detail { margin: 0 14px 14px; } }

.search-wrap { position: relative; }
.search-suggestions { position: absolute; top: calc(100% + 6px); left: 0; z-index: 25; width: min(360px, 86vw); display: grid; gap: 4px; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: var(--shadow); }
.search-suggestions[hidden] { display: none !important; }
.search-suggestions button { display: grid; gap: 3px; width: 100%; padding: 9px 10px; border: 0; border-radius: 6px; background: transparent; color: var(--text); text-align: left; }
.search-suggestions button:hover { background: #f4fbfa; }
.search-suggestions strong { font-size: 13px; }
.search-suggestions span { color: var(--muted); font-size: 12px; }
.view-panel.is-active { animation: viewFadeIn .18s ease; }
@keyframes viewFadeIn { from { opacity: .35; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
.review-view.is-launch-mode .review-hero { border-left-color: var(--amber); background: linear-gradient(90deg, #fff, #fffaf0); }
.review-view.is-launch-mode .review-score-card strong { color: var(--amber); }
.review-view.is-workspace-mode .review-hero, .review-workspace-view .review-hero { border-left-color: var(--brand); background: linear-gradient(90deg, #fff, #f4fbfa); }
.review-workspace-view .review-hero { grid-template-columns: minmax(0,1fr) minmax(430px,520px); align-items: start; padding: 11px 12px; }
.review-workspace-view .review-hero p { margin-top: 4px; }
.review-workspace-view .review-hero-insights div { min-height: 62px; padding: 9px; }
.review-workspace-view .review-score-card { gap: 6px; padding: 10px; }
.review-workspace-view .review-score-card strong { font-size: 24px; }
.review-workspace-view .review-progress-steps { grid-template-columns: repeat(5, minmax(0,1fr)); gap: 5px; }
.review-workspace-view .review-progress-step { grid-template-columns: 1fr; justify-items: center; gap: 4px; min-height: 62px; padding: 7px 5px; text-align: center; }
.review-workspace-view .review-progress-step p { display: none !important; }
.review-workspace-view .review-progress-step > span { width: 18px; height: 18px; }
.review-workspace-view .review-progress-step strong { font-size: 11px; }
.review-workspace-view .review-progress-step em { font-size: 10px; }
.review-workspace-view .review-score-card .ghost-button { justify-content: center; min-height: 32px; }
.review-workspace-layout { grid-template-columns: minmax(0,7fr) minmax(380px,5fr); grid-auto-flow: row dense; align-items: stretch; }
.review-workspace-layout .panel { height: 100%; }
.review-workspace-layout .review-contract-panel { grid-column: 1; }
.review-workspace-layout .review-result-panel { grid-column: 2; }
.review-workspace-layout .review-basis-panel { grid-column: 1; }
.review-workspace-layout .review-explain-panel { grid-column: 2; display: flex; flex-direction: column; }
.review-workspace-layout .review-contract-text { min-height: 860px; max-height: 980px; overflow: auto; }
.review-workspace-layout .review-risk-list { grid-template-columns: 1fr; max-height: 260px; overflow: auto; }
.review-workspace-layout .review-version-list { grid-template-columns: 1fr; }
.review-workspace-layout .review-explain-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.review-basis-history { margin: auto 14px 14px; padding-top: 10px; border-top: 1px dashed #d8e6df; }
.review-basis-history-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.review-basis-history-head h4 { margin: 0; font-size: 13px; }
.review-basis-history-head p { margin-top: 3px; color: var(--muted); font-size: 12px; line-height: 1.4; }
.review-basis-history .review-history-list { grid-template-columns: 1fr; padding: 10px 0 0; }
.review-basis-history .review-history-item { padding: 9px; }
@media (max-width: 1180px) {
  .review-workspace-layout { grid-template-columns: 1fr; }
  .review-workspace-layout .review-contract-panel,
  .review-workspace-layout .review-result-panel,
  .review-workspace-layout .review-basis-panel,
  .review-workspace-layout .review-explain-panel { grid-column: 1 / -1; }
  .review-workspace-layout .review-risk-list,
  .review-workspace-layout .review-explain-grid { max-height: none; overflow: visible; }
  .review-basis-history .review-history-list { grid-template-columns: 1fr; }
}
.review-dimension em { align-self: end; color: var(--brand); font-size: 11px; font-style: normal; font-weight: 700; }
.review-dimension:not(.is-active) em { color: var(--muted); }
.review-contract-text mark { cursor: pointer; outline: 0; transition: background .16s ease, box-shadow .16s ease; }
.review-contract-text mark.is-active, .review-contract-text mark:focus { background: #ffe08a; box-shadow: 0 0 0 3px rgba(184,132,34,.16); }
.review-origin-note { padding: 9px 10px; border: 1px solid #d8e6df; border-radius: 8px; background: #f7faf8; color: var(--brand); font-size: 12px; font-weight: 700; }
.linked-risk { width: 100%; padding: 9px 10px; border: 1px solid #d8e6df; border-radius: 8px; background: #fff; color: var(--brand); text-align: left; font-size: 12px; line-height: 1.5; }
.linked-risk:hover { border-color: var(--brand); background: #f4fbfa; }
.brief-chat { display: grid; gap: 10px; }
.chat-question, .chat-answer { display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 8px; align-items: start; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.chat-question span, .chat-answer span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--brand); color: #fff; font-size: 12px; font-weight: 700; }
.chat-answer span { background: var(--brand-2); }
.brief-input { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; }
.brief-input input { min-height: 34px; border: 1px solid var(--line); border-radius: 8px; padding: 0 10px; color: var(--text); }
.brief-table { display: grid; gap: 8px; }
.brief-table div { padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.brief-table strong, .brief-table span { display: block; }
.brief-table span { margin-top: 4px; color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
@media print {
  .review-view { display: block !important; }
  .review-hero, .review-upload-panel, .review-config-panel, .review-template-panel, .review-summary-panel, .review-history-panel, .review-actions, .review-basis-panel { display: none !important; }
  .review-layout { display: block; }
  .review-contract-panel, .review-result-panel { display: block !important; border: 0; box-shadow: none; break-inside: avoid; }
  .review-contract-text, .review-risk-list { margin: 0 0 14px; border: 0; padding: 0; }
}

.review-progress-steps { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 6px; margin: 4px 0 2px; }
.review-progress-step { transition: border-color .22s ease, background .22s ease, box-shadow .22s ease, opacity .22s ease, transform .22s ease; display: grid; grid-template-columns: 22px minmax(0,1fr); gap: 8px; align-items: start; padding: 7px 8px; border: 1px solid var(--line); border-radius: 8px; background: #fbfcfc; opacity: .72; }
.review-progress-step > span { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: #e8eef0; color: var(--muted-strong); font-size: 11px; font-weight: 700; }
.review-progress-step strong, .review-progress-step em { display: block; }
.review-progress-step strong { font-size: 12px; line-height: 1.2; }
.review-progress-step em { margin-top: 2px; color: var(--muted); font-size: 11px; font-style: normal; }
.review-progress-step p { display: none; margin-top: 4px; color: var(--muted-strong); font-size: 11px; line-height: 1.4; }
.review-progress-step.is-done { border-color: #d8e6df; background: #f7faf8; opacity: 1; }
.review-progress-step.is-done > span { background: var(--brand); color: #fff; }
.review-progress-step.is-active { border-color: var(--amber); background: #fffaf0; opacity: 1; box-shadow: inset 3px 0 0 var(--amber); transform: translateY(-1px); }
.review-progress-step.is-active > span { background: var(--amber); color: #fff; }
.review-progress-step.is-active p { display: block; }
.review-empty.is-processing strong::after { content: ""; display: inline-block; width: 18px; margin-left: 4px; animation: reviewDots 1s steps(3,end) infinite; }
@keyframes reviewDots { 0% { content: ""; } 33% { content: "."; } 66% { content: ".."; } 100% { content: "..."; } }
.primary-button:disabled, .ghost-button:disabled { opacity: .62; cursor: not-allowed; }
@media (max-width: 520px) { .review-progress-steps { grid-template-columns: 1fr; } }

.compare-hero { display: grid; grid-template-columns: minmax(0,1fr) minmax(340px,400px); gap: 12px; margin-top: 10px; padding: 14px 16px; border: 1px solid var(--line); border-left: 4px solid var(--brand-2); border-radius: 8px; background: linear-gradient(90deg, #fff, #f4f9fb); align-items: stretch; }
.compare-hero h2 { margin-top: 8px; font-size: 22px; line-height: 1.25; }
.compare-hero p { margin-top: 6px; color: var(--muted-strong); line-height: 1.5; }
.compare-hero-insights { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; margin-top: 10px; }
.compare-hero-insights div, .compare-score-card, .compare-version-card, .compare-summary-main { border: 1px solid #d8e5e8; border-radius: 8px; background: rgba(255,255,255,.9); }
.compare-hero-insights div { min-height: 76px; padding: 10px; }
.compare-hero-insights span, .compare-hero-insights strong, .compare-hero-insights em, .compare-version-card span, .compare-version-card strong, .compare-version-card em, .compare-summary span, .compare-summary strong, .compare-summary em { display: block; }
.compare-hero-insights span, .compare-version-card span, .compare-summary span { color: var(--muted); font-size: 12px; }
.compare-hero-insights strong { margin-top: 5px; font-size: 13px; line-height: 1.35; }
.compare-hero-insights em { margin-top: 4px; color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.35; }
.compare-score-card { display: grid; gap: 8px; align-content: start; padding: 12px; background: #fff; }
.compare-score-card > span { color: var(--muted); font-size: 12px; }
.compare-score-card > strong { color: var(--brand-2); font-size: 28px; line-height: 1; }
.compare-score-card p { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.compare-score-card.compare-stage-card { align-content: center; }
.compare-score-card > strong.compare-stage-value { color: var(--ink); font-size: 18px; line-height: 1.25; }
.compare-stage-note { min-height: 38px; padding: 8px 10px; border: 1px solid #d8e5e8; border-radius: 6px; background: #f6faf9; color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.compare-action-row { display: flex; flex-wrap: wrap; gap: 8px; }
.compare-layout { display: grid; grid-template-columns: repeat(12, minmax(0,1fr)); gap: 10px; margin-top: 10px; align-items: stretch; grid-auto-flow: row dense; }
.compare-setup-panel { grid-column: span 7; }
.compare-summary-panel { grid-column: span 5; }
.compare-document-panel { grid-column: span 8; }
.compare-diff-panel { grid-column: span 4; }
.compare-basis-panel { grid-column: span 8; }
.compare-suggestion-panel { grid-column: span 4; }
.compare-version-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; padding: 12px 14px 14px; }
.compare-version-card { min-height: 112px; padding: 12px; }
.compare-version-card strong { margin-top: 6px; font-size: 15px; line-height: 1.35; }
.compare-version-card em { margin-top: 5px; color: var(--muted); font-size: 12px; font-style: normal; }
.compare-version-card p { margin-top: 8px; color: var(--muted-strong); font-size: 12px; line-height: 1.5; }
.compare-version-card.is-empty { border-style: dashed; background: #fbfcfc; }
.compare-summary { display: grid; gap: 8px; padding: 12px 14px 14px; }
.compare-summary-main { padding: 12px; background: #f7faf8; }
.compare-summary-main.is-risk { border-color: #f0d0cc; background: #fff7f7; }
.compare-summary-main strong { margin-top: 5px; font-size: 15px; line-height: 1.45; }
.compare-summary-main em { margin-top: 5px; color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.45; }
.compare-doc-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; padding: 12px 14px 14px; }
.compare-doc { min-width: 0; border: 1px solid var(--line); border-radius: 8px; background: #f8fbfb; overflow: hidden; }
.compare-doc header { display: grid; gap: 4px; padding: 10px 12px; border-bottom: 1px solid var(--line); background: #fff; }
.compare-doc header span { color: var(--muted); font-size: 12px; }
.compare-doc header strong { font-size: 13px; line-height: 1.35; }
.compare-doc-body { display: grid; gap: 8px; max-height: 620px; overflow: auto; padding: 10px; }
.compare-section { padding: 10px 11px; border: 1px solid transparent; border-radius: 8px; background: #fff; outline: 0; transition: border-color .16s ease, box-shadow .16s ease, background .16s ease; }
.compare-section h4 { margin: 0 0 6px; font-size: 13px; }
.compare-section p { color: var(--muted-strong); font-size: 13px; line-height: 1.72; }
.compare-section.is-compared { cursor: pointer; border-color: #e6edf0; }
.compare-section.is-high { background: #fff8f7; border-left: 4px solid var(--red); }
.compare-section.is-medium { background: #fffaf0; border-left: 4px solid var(--amber); }
.compare-section.is-low { background: #f5fbf8; border-left: 4px solid var(--green); }
.compare-section.is-active, .compare-section:focus { border-color: var(--brand-2); box-shadow: 0 0 0 3px rgba(47,111,143,.14); }
.compare-filter-tabs { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 14px 0; }
.compare-filter-tabs .tab { min-width: auto; padding: 0 10px; }
.compare-diff-list, .compare-suggestion-list { display: grid; gap: 8px; padding: 12px 14px 14px; }
.compare-diff-item, .compare-suggestion-item { display: grid; gap: 7px; width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); text-align: left; }
.compare-diff-item:hover, .compare-diff-item.is-active, .compare-suggestion-item:hover { border-color: var(--brand-2); background: #f4f9fb; box-shadow: inset 3px 0 0 var(--brand-2); }
.compare-diff-item div, .compare-diff-item footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.compare-diff-item strong, .compare-suggestion-item strong { font-size: 13px; line-height: 1.35; }
.compare-diff-item p, .compare-suggestion-item span { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.compare-diff-item footer span, .compare-diff-item footer em { color: var(--muted); font-size: 11px; font-style: normal; }
.compare-basis-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; padding: 12px 14px 0; }
.compare-basis-grid div { padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.compare-basis-grid div.is-active { border-color: var(--brand-2); background: #eef7f8; box-shadow: inset 3px 0 0 var(--brand-2); }
.compare-basis-grid span, .compare-basis-grid strong, .compare-basis-grid em { display: block; }
.compare-basis-grid span { color: var(--muted); font-size: 12px; }
.compare-basis-grid strong { margin-top: 5px; font-size: 14px; }
.compare-basis-grid em { margin-top: 4px; color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.35; }
.compare-basis-detail { display: grid; gap: 10px; margin: 12px 14px 14px; padding: 14px; border: 1px solid #d8e6df; border-radius: 8px; background: #f7faf8; }
.compare-basis-detail h4 { margin: 0 0 4px; font-size: 13px; }
.compare-basis-detail p { color: var(--muted-strong); font-size: 13px; line-height: 1.55; }
.compare-timeline { display: grid; gap: 8px; padding: 0 14px 14px; }
.compare-timeline:empty { display: none; }
.compare-timeline h4 { margin: 0; font-size: 13px; }
.compare-timeline div { display: grid; grid-template-columns: 52px minmax(0,1fr); gap: 4px 8px; padding: 9px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.compare-timeline span { grid-row: span 2; color: var(--brand-2); font-weight: 800; font-size: 13px; }
.compare-timeline strong { font-size: 12px; }
.compare-timeline em { color: var(--muted); font-size: 11px; font-style: normal; line-height: 1.35; }
@media (max-width: 1180px) { .compare-setup-panel, .compare-summary-panel, .compare-document-panel, .compare-diff-panel, .compare-basis-panel, .compare-suggestion-panel { grid-column: 1 / -1; } .compare-hero { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .compare-hero-insights, .compare-version-grid, .compare-doc-grid, .compare-basis-grid { grid-template-columns: 1fr; } }
@media print { .compare-view { display: block !important; } .compare-hero, .compare-setup-panel, .compare-summary-panel, .compare-diff-panel, .compare-suggestion-panel { display: none !important; } .compare-layout { display: block; } .compare-document-panel, .compare-basis-panel { display: block !important; border: 0; } .compare-doc-grid { display: block; padding: 0; } .compare-doc { margin-bottom: 18px; border: 0; } }

.review-version-list { display: grid; gap: 8px; padding: 0 14px 14px; }
.review-version-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 2px; }
.review-version-head strong { font-size: 13px; }
.review-version-head span { color: var(--muted); font-size: 12px; }
.legal-opinion-card { display: grid; gap: 5px; padding: 10px; border: 1px solid #d8e6df; border-radius: 8px; background: #fff; box-shadow: inset 3px 0 0 var(--amber); }
.legal-opinion-card.is-done { background: #f4fbfa; box-shadow: inset 3px 0 0 var(--green); }
.legal-opinion-card.is-empty { box-shadow: none; border-style: dashed; background: #fbfcfc; }
.legal-opinion-card strong, .legal-opinion-card span, .legal-opinion-card p { display: block; }
.legal-opinion-card strong { font-size: 13px; }
.legal-opinion-card span { color: var(--brand); font-size: 12px; font-weight: 700; }
.legal-opinion-card p { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.review-version-card.is-locked { border-style: dashed; background: #fbfcfc; opacity: .92; }
.review-version-card.is-locked > div span { color: var(--amber); }
.legal-opinion-editor { display: grid; gap: 6px; margin: 10px 0; color: var(--muted-strong); font-size: 12px; }
.legal-opinion-editor textarea { width: 100%; min-height: 150px; resize: vertical; border: 1px solid var(--line); border-radius: 8px; padding: 10px; color: var(--text); font: inherit; line-height: 1.55; }
.legal-opinion-preview { border-left: 3px solid var(--green); padding-left: 8px; background: #f7faf8; }
.review-version-card { display: grid; gap: 7px; padding: 10px; border: 1px solid #d8e6df; border-radius: 8px; background: #f7faf8; }
.review-version-card div, .review-version-card footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.review-version-card strong { font-size: 13px; }
.review-version-card span { min-width: fit-content; color: var(--brand); font-size: 12px; font-weight: 700; }
.review-version-card p { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.review-version-card em { color: var(--muted); font-size: 11px; font-style: normal; }
.compare-history-list { display: grid; gap: 8px; padding: 0 14px 14px; }
.compare-history-list h4 { margin: 0; font-size: 13px; }
.compare-history-item { display: grid; gap: 6px; width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); text-align: left; }
.compare-history-item:hover, .compare-history-item.is-active { border-color: var(--brand-2); background: #f4f9fb; box-shadow: inset 3px 0 0 var(--brand-2); }
.compare-history-item div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.compare-history-item strong { font-size: 13px; }
.compare-history-item span, .compare-history-item em { color: var(--muted); font-size: 11px; font-style: normal; }
.compare-history-item p { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.review-version-source { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.review-version-source div { display: grid; gap: 4px; padding: 8px; border: 1px solid #dce8e2; border-radius: 8px; background: #fff; }
.review-version-source span { color: var(--muted); font-size: 11px; font-weight: 700; }
.review-version-source strong { font-size: 12px; line-height: 1.25; }
.review-version-source em { color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.4; }
.review-version-lineage { display: grid !important; gap: 3px; padding: 8px; border: 1px dashed #c9ded5; border-radius: 8px; background: #fff; }
.review-version-lineage span { color: var(--muted); font-size: 11px; font-weight: 700; }
.review-version-lineage strong { font-size: 12px; }
.review-version-lineage em { color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.4; }
.review-version-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.review-version-card footer { align-items: flex-start; }
.version-preview-head { display: grid; gap: 5px; }
.version-preview-head span { color: var(--brand); font-size: 12px; font-weight: 800; }
.version-preview-head h3 { margin: 0; font-size: 18px; }
.version-preview-head p { color: var(--muted-strong); font-size: 13px; line-height: 1.5; }
.version-source-chain { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; margin: 10px 0; }
.version-source-chain div, .version-preview-side { padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.version-source-chain span, .version-source-chain strong, .version-source-chain em, .version-preview-side strong, .version-preview-side span { display: block; }
.version-source-chain span { color: var(--muted); font-size: 12px; }
.version-source-chain strong { margin-top: 4px; font-size: 13px; }
.version-source-chain em { margin-top: 4px; color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.4; }
.version-preview-layout { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(220px,.65fr); gap: 10px; }
.version-preview-doc { display: grid; gap: 8px; padding: 12px; border: 1px solid #d8e6df; border-radius: 8px; background: #fff; }
.version-preview-doc h4 { margin: 0; font-size: 14px; }
.version-preview-doc p { color: var(--muted-strong); font-size: 13px; line-height: 1.7; }
.version-preview-doc mark { padding: 2px 4px; border-radius: 4px; background: #fff2c2; color: #5f4100; }
.version-preview-side { display: grid; align-content: start; gap: 8px; }
.version-preview-side strong { font-size: 14px; }
.version-preview-side span { color: var(--muted-strong); font-size: 12px; line-height: 1.5; }
@media (max-width: 760px) { .version-source-chain, .version-preview-layout { grid-template-columns: 1fr; } }
.compare-version-origin { display: grid; gap: 7px; margin-top: 10px; }
.compare-version-origin div { display: grid; gap: 2px; padding-top: 7px; border-top: 1px dashed #d8e5e8; }
.compare-version-origin dt { color: var(--brand); font-size: 11px; font-weight: 800; }
.compare-version-origin dd { margin: 0; color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
@media (max-width: 760px) { .review-version-source { grid-template-columns: 1fr; } }
.compare-upload-deck { display: grid; gap: 8px; padding: 12px 14px 0; }
.compare-upload-head, .compare-upload-linked { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px; border: 1px solid #d8e5e8; border-radius: 8px; background: #f7faf8; }
.compare-upload-head strong, .compare-upload-linked strong { display: block; font-size: 13px; }
.compare-upload-head span, .compare-upload-linked span { display: block; margin-top: 3px; color: var(--muted-strong); font-size: 12px; line-height: 1.4; }
.compare-upload-head em { color: var(--brand); font-size: 12px; font-style: normal; font-weight: 800; white-space: nowrap; }
.compare-upload-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.compare-upload-slot { display: grid; gap: 6px; min-width: 0; }
.compare-upload-main { display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 3px 9px; width: 100%; min-height: 86px; padding: 11px; border: 1px dashed #b8cbd0; border-radius: 8px; background: #fbfcfc; color: var(--text); text-align: left; cursor: pointer; }
.compare-upload-main:hover, .compare-upload-slot.is-ready .compare-upload-main { border-style: solid; border-color: var(--brand-2); background: #f4f9fb; }
.compare-upload-main i { grid-row: span 3; align-self: start; width: 24px; height: 24px; color: var(--brand-2); }
.compare-upload-main span { color: var(--muted); font-size: 12px; font-weight: 700; }
.compare-upload-main strong { overflow-wrap: anywhere; font-size: 13px; line-height: 1.35; white-space: normal; }
.compare-upload-main em { color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.35; }
.compare-upload-clear { justify-self: end; color: var(--red); font-size: 12px; }
.compare-version-card.is-upload-pending { border-color: #cbdde2; background: #f8fbfb; }
.ghost-button.is-active { border-color: var(--brand-2); background: #eef7f8; color: var(--brand-2); }
.compare-flow-card { display: grid; gap: 10px; padding: 10px; border: 1px solid #d8e5e8; border-radius: 8px; background: #f7faf8; }
.compare-flow-card header { display: grid; gap: 3px; }
.compare-flow-card header span { color: var(--muted); font-size: 11px; font-weight: 800; }
.compare-flow-card header strong { font-size: 13px; line-height: 1.3; }
.compare-flow-card header em { color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.35; }
.compare-flow-steps { display: grid; gap: 7px; }
.compare-timeline .compare-flow-steps { grid-template-columns: 1fr; padding: 0; border: 0; background: transparent; }
.compare-timeline .compare-flow-step { display: grid; grid-template-columns: 26px minmax(0,1fr); gap: 2px 8px; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.compare-flow-step span { grid-row: span 2; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 999px; background: var(--brand-2); color: #fff; font-size: 11px; font-weight: 800; }
.compare-flow-step strong { font-size: 12px; line-height: 1.3; }
.compare-flow-step em { color: var(--muted); font-size: 11px; font-style: normal; line-height: 1.35; }
@media (max-width: 760px) { .compare-upload-grid { grid-template-columns: 1fr; } .compare-upload-head, .compare-upload-linked { align-items: flex-start; flex-direction: column; } }
.compare-upload-main small { grid-column: 2; color: var(--brand); font-size: 11px; font-weight: 700; line-height: 1.35; }
.compare-identity-check { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px 12px; padding: 10px; border: 1px solid #d8e5e8; border-radius: 8px; background: #fff; }
.compare-identity-check > div:first-child { display: grid; gap: 3px; }
.compare-identity-check span { color: var(--muted); font-size: 11px; font-weight: 800; }
.compare-identity-check strong { font-size: 13px; line-height: 1.35; }
.compare-identity-check em { color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.4; }
.compare-identity-check b { align-self: start; padding: 4px 8px; border-radius: 999px; background: #eef7f8; color: var(--brand-2); font-size: 12px; }
.compare-identity-check.is-pass { border-color: #b8d9c6; background: #f4fbf7; }
.compare-identity-check.is-pass b { background: #e7f6ed; color: var(--green); }
.compare-identity-check.is-fail { border-color: #f0c7c2; background: #fff7f7; }
.compare-identity-check.is-fail b { background: #ffe8e5; color: var(--red); }
.compare-identity-check.is-pending { border-style: dashed; background: #fbfcfc; }
.compare-identity-evidence { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 6px; }
.compare-identity-evidence div { min-width: 0; padding: 7px; border: 1px solid var(--line); border-radius: 7px; background: rgba(255,255,255,.72); }
.compare-identity-evidence strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 760px) { .compare-identity-check, .compare-identity-evidence { grid-template-columns: 1fr; } }
/* Contract version comparison enhancements */
.compare-document-panel { grid-column: 1 / -1; }
.compare-basis-panel { grid-column: span 8; }
.compare-suggestion-panel { grid-column: 1 / -1; }
.compare-action-bar { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; padding: 0 14px 14px; }
.compare-action-bar.is-disabled { opacity: .72; }
.compare-overview-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.compare-overview-grid div, .compare-conclusion-list div, .compare-info-grid div { padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.compare-overview-grid span, .compare-overview-grid strong, .compare-overview-grid em, .compare-conclusion-list strong, .compare-conclusion-list span, .compare-info-grid span, .compare-info-grid strong, .compare-info-grid em { display: block; }
.compare-overview-grid span, .compare-info-grid span { color: var(--muted); font-size: 11px; font-weight: 800; }
.compare-overview-grid strong { margin-top: 4px; color: var(--brand-2); font-size: 18px; }
.compare-overview-grid em, .compare-info-grid em { margin-top: 4px; color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.35; }
.compare-conclusion-list { display: grid; gap: 8px; }
.compare-conclusion-list div { border-color: #d8e6df; background: #f7faf8; }
.compare-conclusion-list strong { color: var(--brand); font-size: 13px; }
.compare-conclusion-list span { margin-top: 5px; color: var(--muted-strong); font-size: 12px; line-height: 1.5; }
.compare-doc-body { max-height: 780px; }
.compare-section footer { display: grid; gap: 4px; margin-top: 8px; padding-top: 8px; border-top: 1px dashed #d8e5e8; }
.compare-section footer span { color: var(--brand); font-size: 11px; font-weight: 800; }
.compare-section footer em { color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.45; }
.compare-section.is-major { background: #fff7f7; border-left: 4px solid var(--red); }
.compare-section.is-added { background: #f7fbff; border-left: 4px solid var(--brand-2); }
.compare-section.is-deleted { background: #fff8f2; border-left: 4px solid var(--amber); }
.compare-section.is-modified { background: #fffaf0; border-left: 4px solid #c79834; }
.compare-section.is-positive { background: #f4fbf7; border-left: 4px solid var(--green); }
.compare-diff-item.is-major { box-shadow: inset 3px 0 0 var(--red); }
.compare-diff-item.is-deleted { box-shadow: inset 3px 0 0 var(--amber); }
.compare-diff-item.is-added { box-shadow: inset 3px 0 0 var(--brand-2); }
.compare-diff-item.is-positive { box-shadow: inset 3px 0 0 var(--green); }
.compare-diff-sides { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 6px; }
.compare-diff-sides div { display: grid; gap: 3px; padding: 7px; border: 1px solid #e2ebee; border-radius: 7px; background: #fbfcfc; }
.compare-diff-sides span { color: var(--muted); font-size: 11px; font-weight: 800; }
.compare-diff-sides em { color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.35; }
.compare-info-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; padding: 0 14px 14px; }
.compare-info-grid strong { margin-top: 4px; font-size: 13px; line-height: 1.35; }
.compare-suggestion-list h4, .compare-case-list h4, .compare-history-list h4 { margin: 0; color: var(--brand); font-size: 13px; }
.compare-case-list { display: grid; gap: 8px; padding: 0 14px 14px; }
.compare-case-item { display: grid; gap: 6px; width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); text-align: left; }
.compare-case-item:hover { border-color: var(--brand-2); background: #f4f9fb; box-shadow: inset 3px 0 0 var(--brand-2); }
.compare-case-item div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.compare-case-item strong { font-size: 13px; line-height: 1.35; }
.compare-case-item span { color: var(--brand); font-size: 11px; font-weight: 800; white-space: nowrap; }
.compare-case-item p, .compare-case-item em, .compare-case-item small { color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.45; }
.compare-suggestion-item em { color: var(--muted); font-size: 11px; font-style: normal; }
@media (max-width: 1180px) { .compare-document-panel, .compare-basis-panel, .compare-suggestion-panel { grid-column: 1 / -1; } }
@media (max-width: 760px) { .compare-overview-grid, .compare-info-grid, .compare-diff-sides { grid-template-columns: 1fr; } .compare-doc-body { max-height: none; } }

/* Dense two-column layout for version comparison */
.compare-view .compare-layout { grid-template-columns: repeat(12, minmax(0,1fr)); align-items: stretch; grid-auto-flow: row dense; }
.compare-view .compare-setup-panel { grid-column: span 6; }
.compare-view .compare-summary-panel { grid-column: span 6; }
.compare-view .compare-document-panel { grid-column: span 8; }
.compare-view .compare-diff-panel { grid-column: span 4; }
.compare-view .compare-basis-panel { grid-column: span 7; }
.compare-view .compare-suggestion-panel { grid-column: span 5; }
.compare-view .compare-summary-panel,
.compare-view .compare-diff-panel,
.compare-view .compare-suggestion-panel,
.compare-view .compare-document-panel,
.compare-view .compare-basis-panel { min-height: 0; }
.compare-view .compare-summary-panel,
.compare-view .compare-diff-panel,
.compare-view .compare-suggestion-panel { display: flex; flex-direction: column; }
.compare-view .compare-summary { flex: 1; align-content: start; }
.compare-view .compare-action-bar { margin-top: auto; }
.compare-view .compare-doc-body { max-height: 720px; }
.compare-view .compare-diff-list { flex: 1; max-height: 720px; overflow: auto; align-content: start; }
.compare-view .compare-basis-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.compare-view .compare-info-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.compare-view .compare-suggestion-list,
.compare-view .compare-case-list,
.compare-view .compare-history-list,
.compare-view .compare-timeline { padding-left: 12px; padding-right: 12px; }
.compare-view .compare-suggestion-list { flex: 1; align-content: start; }
.compare-view .compare-history-list { padding-top: 0; }
.compare-view .compare-flow-card { margin-bottom: 0; }
@media (max-width: 1180px) {
  .compare-view .compare-setup-panel,
  .compare-view .compare-summary-panel,
  .compare-view .compare-document-panel,
  .compare-view .compare-diff-panel,
  .compare-view .compare-basis-panel,
  .compare-view .compare-suggestion-panel { grid-column: 1 / -1; }
  .compare-view .compare-doc-body,
  .compare-view .compare-diff-list { max-height: none; }
}
@media (max-width: 760px) {
  .compare-view .compare-basis-grid,
  .compare-view .compare-info-grid { grid-template-columns: 1fr; }
}

/* Balanced scrollable columns for review and comparison pages */
.review-workspace-layout .review-contract-panel,
.review-workspace-layout .review-result-panel { height: 660px; min-height: 0; display: flex; flex-direction: column; }
.review-workspace-layout .review-contract-text { flex: 1; min-height: 0; max-height: none; overflow: auto; }
.review-workspace-layout .review-result-panel .review-risk-list { flex: 0 0 auto; max-height: 220px; overflow: auto; }
.review-workspace-layout .review-result-panel .review-version-list { flex: 1; min-height: 0; overflow: auto; }
.review-workspace-layout .review-actions { flex: 0 0 auto; }
.review-workspace-layout .review-basis-panel,
.review-workspace-layout .review-explain-panel { height: 520px; min-height: 0; display: flex; flex-direction: column; }
.review-workspace-layout .review-source-grid,
.review-workspace-layout .review-explain-grid,
.review-workspace-layout .review-explain-flow { flex: 0 0 auto; }
.review-workspace-layout .review-basis-body { flex: 1; min-height: 0; overflow: hidden; }
.review-workspace-layout .review-rule-list,
.review-workspace-layout .review-rule-detail { min-height: 0; overflow: auto; }
.review-workspace-layout .review-basis-history { flex: 1; min-height: 0; overflow: auto; }
.review-workspace-layout .review-contract-text,
.review-workspace-layout .review-risk-list,
.review-workspace-layout .review-version-list,
.review-workspace-layout .review-rule-list,
.review-workspace-layout .review-rule-detail,
.review-workspace-layout .review-basis-history { scrollbar-width: thin; }

.compare-view .compare-setup-panel,
.compare-view .compare-summary-panel { height: 420px; min-height: 0; display: flex; flex-direction: column; }
.compare-view .compare-upload-deck,
.compare-view .compare-summary { flex: 1; min-height: 0; overflow: auto; }
.compare-view .compare-version-grid { flex: 0 0 auto; }
.compare-view .compare-document-panel,
.compare-view .compare-diff-panel { height: 680px; min-height: 0; display: flex; flex-direction: column; }
.compare-view .compare-doc-grid { flex: 1; min-height: 0; }
.compare-view .compare-doc { min-height: 0; display: flex; flex-direction: column; }
.compare-view .compare-doc-body { flex: 1; min-height: 0; max-height: none; overflow: auto; }
.compare-view .compare-diff-list { flex: 1; min-height: 0; max-height: none; overflow: auto; }
.compare-view .compare-basis-panel,
.compare-view .compare-suggestion-panel { height: 560px; min-height: 0; display: flex; flex-direction: column; }
.compare-view .compare-basis-grid,
.compare-view .compare-info-grid { flex: 0 0 auto; }
.compare-view .compare-basis-detail { flex: 1; min-height: 0; overflow: auto; }
.compare-view .compare-suggestion-list,
.compare-view .compare-case-list,
.compare-view .compare-history-list,
.compare-view .compare-timeline { flex: 1 1 0; min-height: 0; overflow: auto; }
.compare-view .compare-suggestion-list { max-height: 190px; }
.compare-view .compare-case-list { max-height: 150px; }
.compare-view .compare-history-list { max-height: 130px; }
.compare-view .compare-timeline { max-height: 130px; }
.compare-view .compare-upload-deck,
.compare-view .compare-summary,
.compare-view .compare-doc-body,
.compare-view .compare-diff-list,
.compare-view .compare-basis-detail,
.compare-view .compare-suggestion-list,
.compare-view .compare-case-list,
.compare-view .compare-history-list,
.compare-view .compare-timeline { scrollbar-width: thin; }
@media (max-width: 1180px) {
  .review-workspace-layout .review-contract-panel,
  .review-workspace-layout .review-result-panel,
  .review-workspace-layout .review-basis-panel,
  .review-workspace-layout .review-explain-panel,
  .compare-view .compare-setup-panel,
  .compare-view .compare-summary-panel,
  .compare-view .compare-document-panel,
  .compare-view .compare-diff-panel,
  .compare-view .compare-basis-panel,
  .compare-view .compare-suggestion-panel { height: auto; }
  .review-workspace-layout .review-contract-text,
  .review-workspace-layout .review-risk-list,
  .review-workspace-layout .review-version-list,
  .compare-view .compare-upload-deck,
  .compare-view .compare-summary,
  .compare-view .compare-doc-body,
  .compare-view .compare-diff-list,
  .compare-view .compare-basis-detail,
  .compare-view .compare-suggestion-list,
  .compare-view .compare-case-list,
  .compare-view .compare-history-list,
  .compare-view .compare-timeline { max-height: none; overflow: visible; }
}
.review-workspace-layout .review-contract-panel,
.review-workspace-layout .review-result-panel,
.review-workspace-layout .review-basis-panel,
.review-workspace-layout .review-explain-panel,
.compare-view .compare-setup-panel,
.compare-view .compare-summary-panel,
.compare-view .compare-document-panel,
.compare-view .compare-diff-panel,
.compare-view .compare-basis-panel,
.compare-view .compare-suggestion-panel { overflow: hidden; }
.review-workspace-layout .review-basis-body,
.compare-view .compare-doc-grid { align-items: stretch; }
/* Readable balanced layout after scroll compression */
.review-workspace-layout { grid-template-columns: minmax(0,8fr) minmax(420px,4fr); }
.review-workspace-layout .review-contract-panel,
.review-workspace-layout .review-result-panel { height: clamp(760px, 78vh, 920px); }
.review-workspace-layout .review-contract-text { padding: 18px 22px; font-size: 14px; }
.review-workspace-layout .review-contract-text p { font-size: 14px; line-height: 1.82; }
.review-workspace-layout .review-contract-text h4 { margin-top: 10px; font-size: 15px; }
.review-workspace-layout .review-result-panel .review-risk-list { max-height: 320px; }
.review-workspace-layout .review-result-panel .review-version-list { min-height: 360px; }
.review-workspace-layout .review-basis-panel,
.review-workspace-layout .review-explain-panel { height: clamp(620px, 64vh, 760px); }
.review-workspace-layout .review-rule-detail p,
.review-workspace-layout .basis-chain strong { font-size: 13px; line-height: 1.6; }
.review-workspace-layout .review-basis-history { min-height: 260px; }

.compare-view .compare-layout { grid-template-columns: repeat(12, minmax(0,1fr)); }
.compare-view .compare-setup-panel { grid-column: span 5; height: 460px; }
.compare-view .compare-summary-panel { grid-column: span 7; height: 460px; }
.compare-view .compare-document-panel { grid-column: span 9; height: clamp(780px, 78vh, 940px); }
.compare-view .compare-diff-panel { grid-column: span 3; height: clamp(780px, 78vh, 940px); }
.compare-view .compare-basis-panel { grid-column: span 8; height: clamp(640px, 66vh, 780px); }
.compare-view .compare-suggestion-panel { grid-column: span 4; height: clamp(640px, 66vh, 780px); }
.compare-view .compare-doc-body { padding: 14px; }
.compare-view .compare-section { padding: 13px 14px; }
.compare-view .compare-section h4 { font-size: 14px; }
.compare-view .compare-section p { font-size: 14px; line-height: 1.82; }
.compare-view .compare-diff-list { padding: 12px; }
.compare-view .compare-diff-item { padding: 12px; }
.compare-view .compare-diff-item p,
.compare-view .compare-diff-sides em,
.compare-view .compare-suggestion-item span,
.compare-view .compare-case-item p,
.compare-view .compare-case-item em,
.compare-view .compare-case-item small { font-size: 12.5px; line-height: 1.55; }
.compare-view .compare-basis-detail { margin: 12px 14px 12px; }
.compare-view .compare-suggestion-list { max-height: 300px; }
.compare-view .compare-case-list { max-height: 230px; }
.compare-view .compare-history-list { max-height: 190px; }
.compare-view .compare-timeline { max-height: 190px; }
@media (max-width: 1180px) {
  .review-workspace-layout { grid-template-columns: 1fr; }
  .review-workspace-layout .review-contract-panel,
  .review-workspace-layout .review-result-panel,
  .review-workspace-layout .review-basis-panel,
  .review-workspace-layout .review-explain-panel,
  .compare-view .compare-setup-panel,
  .compare-view .compare-summary-panel,
  .compare-view .compare-document-panel,
  .compare-view .compare-diff-panel,
  .compare-view .compare-basis-panel,
  .compare-view .compare-suggestion-panel { height: auto; min-height: 0; }
}

/* Version comparison scroll policy: keep only the diff list scrollable. */
.compare-view .compare-setup-panel,
.compare-view .compare-summary-panel,
.compare-view .compare-document-panel,
.compare-view .compare-basis-panel,
.compare-view .compare-suggestion-panel {
  height: auto;
  min-height: 0;
  overflow: visible;
}
.compare-view .compare-diff-panel {
  height: clamp(760px, 76vh, 920px);
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.compare-view .compare-upload-deck,
.compare-view .compare-summary,
.compare-view .compare-doc-body,
.compare-view .compare-basis-detail,
.compare-view .compare-suggestion-list,
.compare-view .compare-case-list,
.compare-view .compare-history-list,
.compare-view .compare-timeline {
  flex: initial;
  min-height: auto;
  max-height: none;
  overflow: visible;
}
.compare-view .compare-doc,
.compare-view .compare-doc-grid {
  overflow: visible;
}
.compare-view .compare-doc-grid {
  align-items: start;
}
.compare-view .compare-diff-list {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  overflow: auto;
}
.preview-modal-body.compare-fullscreen-diffs {
  width: min(1180px, calc(100% - 36px));
  padding: 22px;
}
.compare-diff-preview { display: grid; gap: 14px; }
.compare-diff-preview-head {
  display: grid;
  grid-template-columns: minmax(0,1.6fr) minmax(220px,.7fr);
  gap: 12px;
}
.compare-diff-preview-head div,
.compare-diff-preview-grid div {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7faf8;
}
.compare-diff-preview-head span,
.compare-diff-preview-grid span { color: var(--muted); font-size: 12px; }
.compare-diff-preview-head strong { font-size: 16px; line-height: 1.45; }
.compare-diff-preview-head em,
.compare-diff-preview-grid em { color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.45; }
.compare-diff-preview-grid { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 8px; }
.compare-diff-preview-grid strong { color: var(--brand); font-size: 22px; }
.compare-diff-preview-list { display: grid; gap: 10px; }
.compare-diff-preview-item {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand-2);
  border-radius: 8px;
  background: #fff;
}
.compare-diff-preview-item.is-major { border-left-color: var(--red); background: #fff8f7; }
.compare-diff-preview-item.is-modified { border-left-color: var(--amber); background: #fffaf0; }
.compare-diff-preview-item.is-added { border-left-color: var(--brand-2); }
.compare-diff-preview-item.is-deleted { border-left-color: #8c2d2d; }
.compare-diff-preview-item.is-positive { border-left-color: var(--green); background: #f5fbf8; }
.compare-diff-preview-item header { display: grid; grid-template-columns: 110px minmax(0,1fr) 150px; gap: 10px; align-items: center; }
.compare-diff-preview-item header span,
.compare-diff-preview-item header em { color: var(--muted); font-size: 12px; font-style: normal; }
.compare-diff-preview-item header strong { font-size: 15px; line-height: 1.45; }
.compare-diff-preview-item p { margin: 0; font-size: 13px; line-height: 1.7; }
.compare-diff-preview-sides { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.compare-diff-preview-sides div { display: grid; gap: 5px; padding: 10px; border: 1px solid #dfe8e8; border-radius: 8px; background: #fbfcfc; }
.compare-diff-preview-sides span { color: var(--muted); font-size: 12px; }
.compare-diff-preview-sides strong { font-size: 13px; line-height: 1.65; }
.compare-diff-preview-item footer { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto; gap: 10px; align-items: center; }
.compare-diff-preview-item footer span,
.compare-diff-preview-item footer strong { color: var(--muted-strong); font-size: 12px; line-height: 1.55; }
@media (max-width: 1180px) {
  .compare-view .compare-diff-panel { height: auto; overflow: visible; }
  .compare-diff-preview-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .compare-diff-preview-head,
  .compare-diff-preview-item header,
  .compare-diff-preview-sides,
  .compare-diff-preview-item footer { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .preview-modal-body.compare-fullscreen-diffs { width: calc(100% - 20px); padding: 16px; }
  .compare-diff-preview-grid { grid-template-columns: 1fr; }
}

/* Final comparison output alignment */
.compare-view {
  --compare-main-height: clamp(760px, 76vh, 920px);
  --compare-suggestion-height: 438px;
  --compare-case-height: 318px;
}
.compare-view .panel-header.compact {
  align-items: flex-start;
}
.compare-view .compact-tool,
.compare-view .compact-tool span {
  white-space: nowrap;
}
.compare-view .compare-document-panel,
.compare-view .compare-diff-panel {
  height: var(--compare-main-height);
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.compare-view .compare-document-panel { grid-column: span 8; }
.compare-view .compare-diff-panel { grid-column: span 4; }
.compare-view .compare-doc-grid {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  align-items: stretch;
}
.compare-view .compare-doc {
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.compare-view .compare-doc-body,
.compare-view .compare-diff-list {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  overflow: auto;
}
.compare-view .compare-basis-panel { grid-column: span 8; }
.compare-view .compare-suggestion-panel { grid-column: span 4; }
.compare-view .compare-basis-panel,
.compare-view .compare-suggestion-panel {
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.compare-view .compare-basis-detail {
  flex: 1 1 auto;
  min-height: 180px;
  max-height: none;
  overflow: visible;
}
.compare-view .compare-info-grid { flex: 0 0 auto; }
.compare-view .compare-suggestion-list {
  flex: 0 0 auto;
  max-height: var(--compare-suggestion-height);
  overflow: auto;
  align-content: start;
}
.compare-view .compare-case-list {
  flex: 0 0 auto;
  max-height: var(--compare-case-height);
  overflow: auto;
  align-content: start;
}
.compare-view .compare-history-list,
.compare-view .compare-timeline {
  flex: 0 0 auto;
  max-height: none;
  overflow: visible;
}
.preview-modal-body.compare-fullscreen-diffs,
.preview-modal-body.compare-fullscreen-docs,
.preview-modal-body.compare-fullscreen-suggestions {
  width: min(1180px, calc(100% - 36px));
  padding: 22px;
}
.compare-doc-preview,
.compare-suggestion-preview { display: grid; gap: 14px; }
.compare-doc-preview-head,
.compare-doc-preview-grid,
.compare-suggestion-preview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}
.compare-doc-preview-head { grid-template-columns: repeat(2, minmax(0,1fr)); }
.compare-doc-preview-head div {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7faf8;
}
.compare-doc-preview-head span,
.compare-doc-preview-head em,
.compare-doc-preview-section header span,
.compare-doc-preview-section header em,
.compare-suggestion-preview-item header span,
.compare-suggestion-preview-item header em,
.compare-case-preview-item header span { color: var(--muted); font-size: 12px; font-style: normal; }
.compare-doc-preview-head strong { font-size: 16px; line-height: 1.45; }
.compare-doc-preview-grid > article,
.compare-suggestion-preview > section {
  display: grid;
  align-content: start;
  gap: 10px;
  min-width: 0;
}
.compare-doc-preview-grid h3,
.compare-suggestion-preview h3 { margin: 0; font-size: 15px; color: var(--brand); }
.compare-doc-preview-section,
.compare-suggestion-preview-item,
.compare-case-preview-item {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand-2);
  border-radius: 8px;
  background: #fff;
}
.compare-doc-preview-section.is-major,
.compare-suggestion-preview-item.is-major { border-left-color: var(--red); background: #fff8f7; }
.compare-doc-preview-section.is-modified,
.compare-suggestion-preview-item.is-modified { border-left-color: var(--amber); background: #fffaf0; }
.compare-doc-preview-section.is-deleted,
.compare-suggestion-preview-item.is-deleted { border-left-color: #8c2d2d; }
.compare-doc-preview-section.is-positive,
.compare-suggestion-preview-item.is-positive { border-left-color: var(--green); background: #f5fbf8; }
.compare-doc-preview-section header,
.compare-suggestion-preview-item header,
.compare-case-preview-item header {
  display: grid;
  grid-template-columns: 56px minmax(0,1fr) auto;
  gap: 8px;
  align-items: center;
}
.compare-case-preview-item header { grid-template-columns: 120px minmax(0,1fr); }
.compare-doc-preview-section p,
.compare-suggestion-preview-item p,
.compare-case-preview-item p { margin: 0; color: var(--muted-strong); font-size: 13px; line-height: 1.72; }
.compare-doc-preview-section footer,
.compare-suggestion-preview-item footer,
.compare-case-preview-item footer {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
}
.compare-doc-preview-section footer span,
.compare-suggestion-preview-item footer span,
.compare-case-preview-item footer span,
.compare-case-preview-item em { color: var(--muted-strong); font-size: 12px; line-height: 1.55; font-style: normal; }
.compare-suggestion-preview-list,
.compare-case-preview-list { display: grid; gap: 10px; }
@media (max-width: 1180px) {
  .compare-view .compare-document-panel,
  .compare-view .compare-diff-panel,
  .compare-view .compare-basis-panel,
  .compare-view .compare-suggestion-panel { grid-column: 1 / -1; height: auto; overflow: visible; }
  .compare-view .compare-doc-grid { overflow: visible; }
  .compare-view .compare-doc-body,
  .compare-view .compare-diff-list { max-height: 640px; }
  .compare-doc-preview-head,
  .compare-doc-preview-grid,
  .compare-suggestion-preview,
  .compare-doc-preview-section header,
  .compare-suggestion-preview-item header,
  .compare-case-preview-item header,
  .compare-doc-preview-section footer,
  .compare-suggestion-preview-item footer,
  .compare-case-preview-item footer { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .preview-modal-body.compare-fullscreen-diffs,
  .preview-modal-body.compare-fullscreen-docs,
  .preview-modal-body.compare-fullscreen-suggestions { width: calc(100% - 20px); padding: 16px; }
}

.compare-upload-grid.is-disabled .compare-upload-slot,
.compare-upload-slot.is-disabled {
  opacity: .72;
}
.compare-upload-grid.is-disabled .compare-upload-main,
.compare-upload-slot.is-disabled .compare-upload-main {
  cursor: not-allowed;
  border-style: dashed;
  background: #f7faf8;
}
.compare-upload-grid.is-disabled .compare-upload-main:hover,
.compare-upload-slot.is-disabled .compare-upload-main:hover {
  transform: none;
  box-shadow: none;
  border-color: var(--line);
}

/* Comparison readability and linked-difference emphasis */
.compare-fixed-list-head {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px 6px;
  border-top: 1px solid #eef2f2;
  background: #fff;
}
.compare-fixed-list-head h4 { margin: 0; color: var(--brand); font-size: 13px; line-height: 1.3; }
.compare-fixed-list-head span { color: var(--muted); font-size: 11px; white-space: nowrap; }
.compare-view .compare-suggestion-list,
.compare-view .compare-case-list { padding-top: 6px; }
.compare-ai-advice-box {
  scroll-margin-top: 92px;
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #bfd6cf;
  border-left: 4px solid var(--brand-2);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(25,72,93,.06);
}
.compare-ai-advice-box:focus { outline: 3px solid rgba(47,111,143,.18); outline-offset: 2px; }
.compare-advice-textbox {
  min-height: 104px;
  padding: 12px;
  border: 1px solid #d8e6df;
  border-radius: 8px;
  background: #f7faf8;
}
.compare-advice-textbox p { margin: 0; color: var(--text); font-size: 13px; line-height: 1.7; }
.compare-overview-grid .is-total strong,
.compare-filter-tabs .tab.is-all { color: var(--brand); }
.compare-overview-grid .is-major strong,
.compare-filter-tabs .tab.is-major,
.compare-diff-item.is-major strong,
.compare-diff-item.is-major footer em { color: var(--red); }
.compare-overview-grid .is-modified strong,
.compare-filter-tabs .tab.is-modified,
.compare-diff-item.is-modified strong,
.compare-diff-item.is-modified footer em { color: #9a6a12; }
.compare-overview-grid .is-added strong,
.compare-filter-tabs .tab.is-added,
.compare-diff-item.is-added strong,
.compare-diff-item.is-added footer em { color: var(--brand-2); }
.compare-overview-grid .is-deleted strong,
.compare-filter-tabs .tab.is-deleted,
.compare-diff-item.is-deleted strong,
.compare-diff-item.is-deleted footer em { color: #9b4d0c; }
.compare-overview-grid .is-positive strong,
.compare-filter-tabs .tab.is-positive,
.compare-diff-item.is-positive strong,
.compare-diff-item.is-positive footer em { color: var(--green); }
.compare-overview-grid .is-major { border-color: #f0c3bf; background: #fff7f7; }
.compare-overview-grid .is-modified { border-color: #efd79d; background: #fffaf0; }
.compare-overview-grid .is-added { border-color: #c5dce5; background: #f7fbff; }
.compare-overview-grid .is-deleted { border-color: #efd3b4; background: #fff8f2; }
.compare-overview-grid .is-positive { border-color: #c8e2d4; background: #f4fbf7; }
.compare-filter-tabs .tab.is-major.is-active { border-color: var(--red); background: #fff1ef; }
.compare-filter-tabs .tab.is-modified.is-active { border-color: var(--amber); background: #fffaf0; }
.compare-filter-tabs .tab.is-added.is-active { border-color: var(--brand-2); background: #eef7f8; }
.compare-filter-tabs .tab.is-deleted.is-active { border-color: #c8751d; background: #fff8f2; }
.compare-filter-tabs .tab.is-positive.is-active { border-color: var(--green); background: #f0faf4; }
.compare-diff-item.is-major { border-color: #f0c3bf; background: #fff8f7; }
.compare-diff-item.is-modified { border-color: #efd79d; background: #fffaf0; box-shadow: inset 3px 0 0 var(--amber); }
.compare-diff-item.is-added { border-color: #c5dce5; background: #f7fbff; }
.compare-diff-item.is-deleted { border-color: #efd3b4; background: #fff8f2; }
.compare-diff-item.is-positive { border-color: #c8e2d4; background: #f4fbf7; }
.compare-section.is-active,
.compare-section.is-active:focus {
  border-color: #1f5f78;
  background: #eef7f8;
  box-shadow: 0 0 0 3px rgba(47,111,143,.2), inset 4px 0 0 var(--brand-2);
}
.compare-section.is-active h4 { color: var(--brand); }
.compare-section.is-active.is-high { border-color: #d78d87; background: #fff1ef; box-shadow: 0 0 0 3px rgba(179,38,30,.16), inset 4px 0 0 var(--red); }
.compare-section.is-active.is-high h4 { color: var(--red); }
.compare-section.is-active.is-medium { border-color: #e3c271; background: #fff7df; box-shadow: 0 0 0 3px rgba(184,132,34,.16), inset 4px 0 0 var(--amber); }
.compare-section.is-active.is-medium h4 { color: #9a6a12; }
.compare-section.is-active.is-low { border-color: #9ecdb2; background: #ecfaf2; box-shadow: 0 0 0 3px rgba(23,111,77,.14), inset 4px 0 0 var(--green); }
.compare-section.is-active.is-low h4 { color: var(--green); }

/* Iteration: compact navigation control and staged comparison output */
.menu-tools {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 8px 10px 4px;
  border-bottom: 1px solid #2a6968;
}
.menu-tool-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  min-height: 32px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 8px;
  background: rgba(255,255,255,.06);
  color: #dfe9ec;
  font-size: 12px;
  font-weight: 700;
}
.menu-tool-button:hover,
.menu-tool-button[aria-pressed="true"] {
  border-color: rgba(255,255,255,.24);
  background: rgba(255,255,255,.11);
  color: #fff;
}
.menu-tool-button svg,
.menu-tool-button i {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}
.sidebar,
.content {
  transition: width .26s cubic-bezier(.2,.8,.2,1), min-width .26s cubic-bezier(.2,.8,.2,1), max-width .26s cubic-bezier(.2,.8,.2,1), flex-basis .26s cubic-bezier(.2,.8,.2,1);
}
.app-shell.is-sidebar-collapsed .sidebar {
  width: 72px;
  min-width: 72px;
  max-width: 72px;
  flex: 0 0 72px;
  overflow-x: hidden;
}
.app-shell.is-sidebar-collapsed .content {
  width: calc(100% - 72px);
}
.app-shell.is-sidebar-collapsed .brand {
  justify-content: center;
  padding-inline: 10px;
}
.app-shell.is-sidebar-collapsed .brand > div:not(.brand-mark) {
  display: none;
}
.app-shell.is-sidebar-collapsed .menu-tools {
  grid-template-columns: 1fr;
  gap: 0;
  padding-inline: 16px;
}
.app-shell.is-sidebar-collapsed #toggleMenuGroups {
  display: none;
}
.app-shell.is-sidebar-collapsed .menu-tool-button {
  min-height: 38px;
  padding: 0;
}
.app-shell.is-sidebar-collapsed .menu-tool-button span {
  display: none;
}
.app-shell.is-sidebar-collapsed .menu {
  padding: 10px 8px;
}
.app-shell.is-sidebar-collapsed .menu-title {
  grid-template-columns: 1fr;
  justify-items: center;
  min-height: 42px;
  padding-inline: 0;
}
.app-shell.is-sidebar-collapsed .menu-title span,
.app-shell.is-sidebar-collapsed .menu-title .chevron,
.app-shell.is-sidebar-collapsed .submenu {
  display: none !important;
}
.app-shell.is-sidebar-collapsed .menu-title svg,
.app-shell.is-sidebar-collapsed .menu-title i {
  width: 19px;
  height: 19px;
}
@media (max-width: 900px) {
  .app-shell.is-sidebar-collapsed .sidebar {
    width: 256px;
    min-width: 256px;
    max-width: 256px;
    flex: 0 0 256px;
  }
  .app-shell.is-sidebar-collapsed .content {
    width: 100%;
  }
  .app-shell.is-sidebar-collapsed .brand {
    justify-content: flex-start;
    padding: 17px 18px 13px;
  }
  .app-shell.is-sidebar-collapsed .brand > div:not(.brand-mark),
  .app-shell.is-sidebar-collapsed .menu-tool-button span,
  .app-shell.is-sidebar-collapsed .menu-title span,
  .app-shell.is-sidebar-collapsed .menu-title .chevron {
    display: block !important;
  }
  .app-shell.is-sidebar-collapsed .menu-title {
    grid-template-columns: 20px minmax(0,1fr) 16px;
    justify-items: stretch;
    padding: 8px 10px;
  }
}
.compare-progress-flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 6px;
}
.compare-progress-node {
  display: grid;
  grid-template-columns: 24px minmax(0,1fr);
  gap: 2px 7px;
  align-items: center;
  min-height: 52px;
  padding: 8px;
  border: 1px solid #d8e5e8;
  border-radius: 8px;
  background: #fff;
}
.compare-progress-node span {
  grid-row: span 2;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #eef3f5;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.compare-progress-node strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}
.compare-progress-node em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}
.compare-progress-node.is-done {
  border-color: #c8e2d4;
  background: #f4fbf7;
}
.compare-progress-node.is-done span {
  background: var(--green);
  color: #fff;
}
.compare-progress-node.is-active {
  border-color: #bfd6df;
  background: #eef7f8;
  box-shadow: inset 3px 0 0 var(--brand-2);
}
.compare-progress-node.is-active span {
  background: var(--brand-2);
  color: #fff;
}
.compare-distribution {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  width: 100%;
}
.compare-distribution-segment {
  display: grid;
  align-content: center;
  gap: 2px;
  flex-grow: 1;
  min-width: 82px;
  min-height: 56px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
}
.compare-distribution-segment:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(25,72,93,.08);
}
.compare-distribution-segment strong,
.compare-distribution-segment span {
  display: block;
}
.compare-distribution-segment strong {
  font-size: 18px;
  line-height: 1;
}
.compare-distribution-segment span {
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}
.compare-distribution-segment.is-major { border-color: #f0c3bf; background: #fff7f7; color: var(--red); }
.compare-distribution-segment.is-modified { border-color: #efd79d; background: #fffaf0; color: #9a6a12; }
.compare-distribution-segment.is-deleted { border-color: #efd3b4; background: #fff8f2; color: #9b4d0c; }
.compare-distribution-segment.is-added { border-color: #c5dce5; background: #f7fbff; color: var(--brand-2); }
.compare-distribution-segment.is-positive { border-color: #c8e2d4; background: #f4fbf7; color: var(--green); }
.compare-advice-source-tags {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 6px;
}
.compare-advice-source-tags span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px;
  border: 1px solid #d8e6df;
  border-radius: 8px;
  background: #f7faf8;
  color: var(--muted-strong);
  font-size: 11px;
  line-height: 1.35;
}
.compare-advice-source-tags b {
  color: var(--brand-2);
  font-size: 11px;
}
.compare-view .compare-summary .compare-progress-flow,
.compare-view .compare-summary .compare-distribution {
  flex: 0 0 auto;
}
@media (max-width: 1180px) {
  .compare-progress-flow { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .compare-distribution { flex-wrap: wrap; }
}
@media (max-width: 760px) {
  .compare-progress-flow,
  .compare-advice-source-tags { grid-template-columns: 1fr; }
  .compare-distribution-segment { flex: 1 1 44%; }
}

/* Draft export options */
.export-format-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
}
.export-format-card {
  display: grid;
  gap: 6px;
  min-height: 118px;
  padding: 14px;
  border: 1px solid #d8e6df;
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
}
.export-format-card:hover {
  border-color: var(--brand);
  background: #f4fbfa;
  box-shadow: inset 3px 0 0 var(--brand);
}
.export-format-card span {
  width: fit-content;
  padding: 4px 8px;
  border-radius: 999px;
  background: #e6f1f4;
  color: var(--brand-2);
  font-size: 12px;
  font-weight: 800;
}
.export-format-card strong { font-size: 15px; }
.export-format-card em {
  color: var(--muted-strong);
  font-size: 12px;
  font-style: normal;
  line-height: 1.55;
}
@media (max-width: 760px) { .export-format-grid { grid-template-columns: 1fr; } }

/* Electronic signature workflow */
.sign-hero {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(340px,400px);
  gap: 12px;
  margin-top: 10px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: linear-gradient(90deg, #fff, #f4fbfa);
  align-items: stretch;
}
.sign-hero-copy { display: grid; align-content: start; gap: 10px; min-width: 0; }
.sign-hero h2 { margin-top: 8px; font-size: 22px; line-height: 1.25; }
.sign-hero p { margin-top: 6px; color: var(--muted-strong); line-height: 1.5; }
.sign-hero-insights { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.sign-hero-insights div,
.sign-score-card,
.sign-contract-card { border: 1px solid #d8e6df; border-radius: 8px; background: rgba(255,255,255,.9); }
.sign-hero-insights div { min-height: 78px; padding: 10px; }
.sign-hero-insights span,
.sign-hero-insights strong,
.sign-hero-insights em,
.sign-score-card span,
.sign-score-card strong,
.sign-score-card p { display: block; }
.sign-hero-insights span,
.sign-score-card span { color: var(--muted); font-size: 12px; }
.sign-hero-insights strong { margin-top: 5px; font-size: 13px; line-height: 1.35; }
.sign-hero-insights em { margin-top: 4px; color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.35; }
.sign-score-card { display: grid; gap: 7px; align-content: start; padding: 11px 12px; }
.sign-score-card > strong { color: var(--brand); font-size: 28px; line-height: 1; }
.sign-score-card p { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.sign-action-row,
.sign-flow-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.sign-layout { display: grid; grid-template-columns: repeat(12, minmax(0,1fr)); gap: 10px; margin-top: 10px; align-items: stretch; grid-auto-flow: row dense; }
.sign-material-panel { grid-column: span 6; }
.sign-authority-panel { grid-column: span 6; }
.sign-flow-panel { grid-column: span 12; }
.sign-document-panel { grid-column: span 7; }
.sign-config-panel { grid-column: span 5; }
.sign-evidence-panel { grid-column: span 7; }
.sign-history-panel { grid-column: span 5; }
.sign-material-summary,
.sign-authority-grid,
.sign-subject-list,
.sign-seal-list,
.sign-position-list,
.sign-evidence-grid,
.sign-history-list { display: grid; gap: 8px; padding: 12px 14px 14px; }
.sign-contract-card { display: grid; gap: 5px; padding: 11px; background: #f7faf8; }
.sign-contract-card span,
.sign-contract-card em { color: var(--muted); font-size: 12px; font-style: normal; }
.sign-contract-card strong { font-size: 15px; line-height: 1.35; }
.sign-contract-card p { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.sign-check-grid,
.sign-evidence-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
.sign-authority-overview,
.sign-boundary-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.sign-authority-card,
.sign-boundary-card { display: grid; gap: 5px; min-height: 96px; padding: 10px; border: 1px solid var(--line); border-left: 4px solid #b7c6ce; border-radius: 8px; background: #fff; }
.sign-authority-card span,
.sign-authority-card strong,
.sign-authority-card em,
.sign-boundary-card span,
.sign-boundary-card strong,
.sign-boundary-card em { display: block; }
.sign-authority-card span,
.sign-boundary-card span { color: var(--muted); font-size: 12px; }
.sign-authority-card strong,
.sign-boundary-card strong { font-size: 13px; line-height: 1.35; }
.sign-authority-card em,
.sign-boundary-card em { color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.45; }
.sign-authority-card.is-ok,
.sign-boundary-card.is-allowed { border-left-color: var(--green); background: #f4fbf7; }
.sign-authority-card.is-warn,
.sign-boundary-card.is-warning { border-left-color: #c8932c; background: #fffaf0; }
.sign-boundary-card.is-blocked { border-left-color: #b65c5c; background: #fff6f6; }
.sign-check-grid { display: grid; gap: 8px; }
.sign-check-grid div,
.sign-evidence-grid div { padding: 9px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.sign-check-grid span,
.sign-check-grid strong,
.sign-evidence-grid span,
.sign-evidence-grid strong,
.sign-evidence-grid em { display: block; }
.sign-check-grid span,
.sign-evidence-grid span { color: var(--muted); font-size: 12px; }
.sign-check-grid strong,
.sign-evidence-grid strong { margin-top: 5px; font-size: 13px; line-height: 1.35; }
.sign-evidence-grid em { margin-top: 4px; color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.35; }
.sign-flow { display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: 7px; padding: 12px 14px; }
.sign-flow-step { display: grid; justify-items: center; align-content: start; gap: 5px; min-height: 90px; padding: 9px 6px; border: 1px solid var(--line); border-radius: 8px; background: #fff; text-align: center; }
.sign-flow-step span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 999px; background: #eef3f5; color: var(--muted); font-size: 11px; font-weight: 800; }
.sign-flow-step strong { font-size: 12px; line-height: 1.25; }
.sign-flow-step em { color: var(--muted); font-size: 11px; font-style: normal; line-height: 1.3; }
.sign-flow-step.is-done { border-color: #c8e2d4; background: #f4fbf7; }
.sign-flow-step.is-done span { background: var(--green); color: #fff; }
.sign-flow-step.is-active { border-color: #bfd6df; background: #eef7f8; box-shadow: inset 0 -3px 0 var(--brand-2); }
.sign-flow-actions { padding: 0 14px 14px; }
.sign-contract-doc { padding: 12px 14px 14px; }
.sign-doc-page { display: grid; gap: 10px; min-height: 620px; padding: 18px 20px; border: 1px solid #dce3e6; border-radius: 8px; background: #fff; }
.sign-doc-page header { display: grid; justify-items: center; gap: 5px; padding-bottom: 10px; border-bottom: 1px solid #edf0f4; text-align: center; }
.sign-doc-page header span,
.sign-doc-page header em { color: var(--muted); font-size: 12px; font-style: normal; }
.sign-doc-page header strong { font-size: 20px; }
.sign-doc-page h4 { margin-top: 8px; font-size: 14px; }
.sign-doc-page p { color: var(--muted-strong); font-size: 13px; line-height: 1.78; }
.sign-page-zone { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; margin-top: 8px; padding: 18px 14px 96px; border: 1px dashed #cbdde2; border-radius: 8px; background: #fbfcfc; }
.sign-page-zone > div { display: grid; gap: 12px; min-height: 132px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.sign-page-zone b,
.sign-page-zone span { font-size: 13px; }
.sign-marker { position: relative; display: grid; gap: 2px; align-content: center; min-height: 62px; padding: 9px; border: 1px solid #d8e6df; border-left: 4px solid var(--brand); border-radius: 8px; background: #f4fbfa; color: var(--text); text-align: left; }
.sign-marker.is-active { border-color: var(--brand-2); background: #eef7f8; box-shadow: 0 0 0 3px rgba(47,111,143,.14); }
.sign-marker span,
.sign-marker strong,
.sign-marker em { display: block; font-size: 12px; }
.sign-marker em { color: var(--brand); font-style: normal; font-weight: 800; }
.sign-placeholder { grid-column: 1 / -1; display: grid; place-items: center; min-height: 70px; border: 1px dashed var(--line-strong); border-radius: 8px; color: var(--muted); font-size: 12px; }
.sign-subject-list h4,
.sign-seal-list h4,
.sign-position-list h4 { margin: 0; color: var(--brand); font-size: 13px; }
.sign-subject-card,
.sign-seal-card,
.sign-position-card,
.sign-history-item { display: grid; gap: 6px; width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); text-align: left; }
.sign-subject-card div,
.sign-seal-card div,
.sign-position-card div,
.sign-history-item div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sign-subject-card strong,
.sign-seal-card strong,
.sign-position-card strong,
.sign-history-item strong { font-size: 13px; line-height: 1.35; }
.sign-subject-card span,
.sign-seal-card span,
.sign-position-card span,
.sign-history-item span { min-width: fit-content; color: var(--brand); font-size: 11px; font-weight: 800; }
.sign-subject-card p,
.sign-seal-card p,
.sign-position-card p,
.sign-history-item p { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.sign-subject-card em,
.sign-position-card em,
.sign-history-item em { color: var(--muted); font-size: 11px; font-style: normal; line-height: 1.35; }
.preview-modal-body.sign-effect-preview { width: min(1120px, calc(100% - 36px)); padding: 22px; background: #f7faf8; }
.sign-effect-doc { display: grid; gap: 12px; }
.sign-effect-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 16px; border: 1px solid #d8e6df; border-left: 4px solid var(--brand); border-radius: 8px; background: #fff; }
.sign-effect-head span,
.sign-effect-head em { display: block; color: var(--muted); font-size: 12px; font-style: normal; }
.sign-effect-head h3 { margin: 4px 0; font-size: 20px; }
.sign-effect-status { min-width: 118px; padding: 10px; border: 1px solid #cfe0dc; border-radius: 8px; background: #f4fbf7; text-align: center; }
.sign-effect-status strong { display: block; color: var(--brand); font-size: 24px; line-height: 1; }
.sign-effect-status span { margin-top: 5px; }
.sign-effect-summary,
.sign-effect-locations { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; }
.sign-effect-summary div,
.sign-effect-locations div,
.sign-effect-note { padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.sign-effect-summary span,
.sign-effect-summary strong,
.sign-effect-summary em,
.sign-effect-locations span,
.sign-effect-locations strong,
.sign-effect-locations em,
.sign-effect-note strong,
.sign-effect-note span { display: block; }
.sign-effect-summary span,
.sign-effect-locations span { color: var(--muted); font-size: 12px; }
.sign-effect-summary strong,
.sign-effect-locations strong { margin-top: 5px; font-size: 13px; line-height: 1.35; }
.sign-effect-summary em,
.sign-effect-locations em,
.sign-effect-note span { margin-top: 5px; color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.5; }
.sign-effect-paper { display: grid; gap: 12px; min-height: 560px; padding: 26px 32px; border: 1px solid #dce3e6; border-radius: 8px; background: #fff; box-shadow: 0 10px 24px rgba(17,43,49,.08); }
.sign-effect-title { display: grid; justify-items: center; gap: 4px; padding-bottom: 12px; border-bottom: 1px solid #edf0f4; text-align: center; }
.sign-effect-title span,
.sign-effect-title em { color: var(--muted); font-size: 12px; font-style: normal; }
.sign-effect-title strong { font-size: 22px; }
.sign-effect-paper p { color: var(--muted-strong); font-size: 14px; line-height: 1.85; }
.sign-effect-clause { display: grid; gap: 6px; padding: 12px; border: 1px dashed #cbdde2; border-radius: 8px; background: #fbfcfc; }
.sign-effect-clause strong { font-size: 14px; }
.sign-effect-clause span { color: var(--muted-strong); font-size: 13px; line-height: 1.7; }
.sign-effect-zone { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; margin-top: 8px; padding: 18px 14px 70px; border: 1px dashed #cbdde2; border-radius: 8px; background: #fbfcfc; }
.sign-effect-zone section { display: grid; gap: 12px; min-height: 192px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.signature-stamp { display: grid; place-items: center; gap: 3px; width: 168px; min-height: 104px; margin: 4px auto; border: 2px solid #b65c5c; border-radius: 50%; color: #a33a2a; text-align: center; transform: rotate(-8deg); }
.signature-stamp span,
.signature-stamp strong,
.signature-stamp em { display: block; font-style: normal; }
.signature-stamp span { font-size: 12px; }
.signature-stamp strong { max-width: 128px; font-size: 13px; line-height: 1.25; }
.signature-stamp em { font-size: 11px; }
.signature-stamp.is-preview { opacity: .54; border-style: dashed; }
.signature-stamp.is-sent { opacity: .76; }
.signature-stamp.is-signed { opacity: 1; background: rgba(179,38,30,.04); }
.signature-line { display: flex; justify-content: space-between; gap: 10px; padding-top: 10px; border-top: 1px solid #edf0f4; color: var(--muted-strong); font-size: 13px; }
.paging-stamp { position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); width: min(360px, calc(100% - 40px)); padding: 9px 12px; border: 1px solid #b65c5c; border-radius: 999px; color: #a33a2a; background: #fff6f6; text-align: center; font-size: 12px; font-weight: 800; }
.paging-stamp.is-preview { opacity: .56; border-style: dashed; }
.sign-effect-locations div.is-active { border-color: var(--brand); background: #f4fbfa; box-shadow: inset 3px 0 0 var(--brand); }
.sign-effect-note { border-left: 4px solid #b65c5c; background: #fff; }
.sign-effect-note strong { color: #8f2f2a; font-size: 13px; }
@media (max-width: 900px) {
  .preview-modal-body.sign-effect-preview { width: calc(100% - 20px); padding: 16px; }
  .sign-effect-head,
  .sign-effect-zone { grid-template-columns: 1fr; }
  .sign-effect-head { display: grid; }
  .sign-effect-summary,
  .sign-effect-locations { grid-template-columns: 1fr; }
  .sign-effect-paper { padding: 18px; }
}
.sign-seal-card:hover,
.sign-seal-card.is-active,
.sign-position-card:hover,
.sign-position-card.is-active,
.sign-history-item:hover { border-color: var(--brand); background: #f4fbfa; box-shadow: inset 3px 0 0 var(--brand); }
@media (max-width: 1180px) {
  .sign-hero,
  .sign-hero-insights,
  .sign-check-grid,
  .sign-evidence-grid { grid-template-columns: 1fr; }
  .sign-material-panel,
  .sign-authority-panel,
  .sign-flow-panel,
  .sign-document-panel,
  .sign-config-panel,
  .sign-evidence-panel,
  .sign-history-panel { grid-column: 1 / -1; }
  .sign-flow { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .sign-authority-overview,
  .sign-boundary-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .sign-flow,
  .sign-page-zone,
  .sign-authority-overview,
  .sign-boundary-grid { grid-template-columns: 1fr; }
  .sign-doc-page { min-height: auto; }
}

/* Signing task refinements */
.sign-ai-button,
.sign-ai-button:hover {
  background: #0f5f78;
  border-color: #0f5f78;
  color: #fff;
  box-shadow: 0 8px 18px rgba(15,95,120,.22);
}
.sign-ai-button span,
.sign-ai-button i { color: #fff; stroke: #fff; }
.sign-risk-panel { grid-column: span 7; }
.sign-evidence-panel { grid-column: span 5; }
.sign-history-panel { grid-column: span 12; }
.sign-task-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; }
.sign-task-grid div,
.sign-config-toolbar div { padding: 9px; border: 1px solid #d8e6df; border-radius: 8px; background: #f7faf8; }
.sign-task-grid span,
.sign-task-grid strong,
.sign-config-toolbar span,
.sign-config-toolbar strong,
.sign-config-toolbar em { display: block; }
.sign-task-grid span,
.sign-config-toolbar span { color: #5f6f78; font-size: 12px; }
.sign-task-grid strong,
.sign-config-toolbar strong { margin-top: 5px; color: #12343d; font-size: 13px; line-height: 1.35; }
.sign-config-toolbar em { margin-top: 4px; color: #667085; font-size: 11px; font-style: normal; line-height: 1.4; }
.sign-task-list { display: grid; gap: 8px; }
.sign-task-row { display: grid; gap: 5px; padding: 10px; border: 1px solid #d8e6df; border-left: 4px solid #0f766e; border-radius: 8px; background: #fff; }
.sign-task-row div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sign-task-row strong { color: #12343d; font-size: 13px; }
.sign-task-row span,
.sign-task-row em { color: #667085; font-size: 12px; font-style: normal; line-height: 1.4; }
.sign-config-toolbar { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; padding: 12px 14px 0; }
.sign-policy-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.sign-policy-card { display: grid; gap: 5px; min-height: 88px; padding: 10px; border: 1px solid var(--line); border-left: 4px solid #2f6f8f; border-radius: 8px; background: #fff; }
.sign-policy-card span,
.sign-policy-card strong,
.sign-policy-card em { display: block; }
.sign-policy-card span { color: #5f6f78; font-size: 12px; }
.sign-policy-card strong { color: #12343d; font-size: 13px; line-height: 1.35; }
.sign-policy-card em { color: #667085; font-size: 11px; font-style: normal; line-height: 1.45; }
.sign-policy-card.is-ok { border-left-color: #0f766e; background: #f4fbf7; }
.sign-policy-card.is-warn { border-left-color: #c8932c; background: #fffaf0; }
.sign-risk-list { display: grid; gap: 8px; padding: 12px 14px 14px; }
.sign-risk-card { display: grid; gap: 8px; padding: 11px; border: 1px solid var(--line); border-left: 4px solid #8a98a5; border-radius: 8px; background: #fff; }
.sign-risk-card.is-high { border-left-color: #b3261e; background: #fff6f6; }
.sign-risk-card.is-medium { border-left-color: #c8932c; background: #fffaf0; }
.sign-risk-card.is-low { border-left-color: #0f766e; background: #f4fbf7; }
.sign-risk-card div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sign-risk-card span { min-width: fit-content; padding: 3px 7px; border-radius: 999px; background: rgba(47,111,143,.12); color: #1f5c76; font-size: 11px; font-weight: 800; }
.sign-risk-card.is-high span { background: rgba(179,38,30,.12); color: #9b2f25; }
.sign-risk-card.is-medium span { background: rgba(200,147,44,.16); color: #805a16; }
.sign-risk-card strong { color: #12343d; font-size: 13px; }
.sign-risk-card p,
.sign-risk-card em { color: #667085; font-size: 12px; line-height: 1.5; font-style: normal; }
.sign-risk-card footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.sign-operation-guide { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 5px; margin-top: 8px; }
.sign-operation-guide strong { grid-column: 1 / -1; color: #12343d; font-size: 12px; }
.sign-operation-guide span { padding: 5px 7px; border-radius: 6px; background: #eaf3f5; color: #1f5c76; font-size: 11px; font-weight: 700; }
.signature-stamp { position: relative; width: 132px; height: 132px; min-height: 132px; border-width: 3px; border-radius: 50%; background: rgba(179,38,30,.03); }
.signature-stamp::before { content: ""; position: absolute; inset: 8px; border: 1px solid rgba(179,38,30,.56); border-radius: 50%; pointer-events: none; }
.signature-stamp span { color: #a33a2a; font-weight: 800; }
.signature-stamp strong { max-width: 104px; color: #a33a2a; }
@media (max-width: 1180px) {
  .sign-risk-panel,
  .sign-evidence-panel,
  .sign-history-panel { grid-column: 1 / -1; }
  .sign-task-grid,
  .sign-config-toolbar,
  .sign-policy-grid { grid-template-columns: 1fr; }
}
/* Signing layout ordering and tighter module fit */
.sign-layout { gap: 8px; align-items: stretch; }
.sign-flow-panel { order: 1; grid-column: 1 / -1; }
.sign-material-panel { order: 2; grid-column: span 7; }
.sign-authority-panel { order: 3; grid-column: span 5; }
.sign-document-panel { order: 4; grid-column: span 7; }
.sign-config-panel { order: 5; grid-column: span 5; }
.sign-risk-panel { order: 6; grid-column: span 7; }
.sign-evidence-panel { order: 7; grid-column: span 5; }
.sign-history-panel { order: 8; grid-column: 1 / -1; }
.sign-flow-actions { justify-content: flex-start; padding: 0 14px 14px; }
.sign-flow { grid-template-columns: repeat(6, minmax(0,1fr)); padding-bottom: 10px; }
.sign-flow-step { min-height: 92px; }
.sign-material-summary,
.sign-authority-grid,
.sign-subject-list,
.sign-seal-list,
.sign-position-list,
.sign-evidence-grid,
.sign-history-list,
.sign-risk-list { padding: 10px 12px 12px; }
.sign-contract-card.is-task { border: 1px solid #d8e6df; border-radius: 8px; }
@media (max-width: 1180px) {
  .sign-flow-panel,
  .sign-material-panel,
  .sign-authority-panel,
  .sign-document-panel,
  .sign-config-panel,
  .sign-risk-panel,
  .sign-evidence-panel,
  .sign-history-panel { order: initial; grid-column: 1 / -1; }
  .sign-flow { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 760px) {
  .sign-flow { grid-template-columns: 1fr; }
}
/* Electronic signature role-based workspace */
.sign-role-hero { grid-template-columns: minmax(0,1.25fr) minmax(320px,.75fr); }
.sign-status-done { background: #e7f6ed; color: #0f6b3d; }
.sign-status-active { background: #fff6df; color: #8a5a00; }
.sign-status-pending { background: #eef3f5; color: #43515c; }
.sign-approval-approved { background: #e7f6ed; color: #0f6b3d; }
.sign-approval-pending { background: #fff6df; color: #8a5a00; }
.sign-approval-rejected { background: #fdecec; color: #b42318; }
.sign-approval-neutral { background: #eef3f5; color: #43515c; }
.sign-seal-contract { background: #e8f1ff; color: #1d4f91; }
.sign-seal-business { background: #f0f7f5; color: #07564f; }
.sign-seal-enterprise { background: #eef0ff; color: #3730a3; }
.sign-seal-paging { background: #fff3e6; color: #9a4f00; }
.sign-seal-legal { background: #f6eefe; color: #6b21a8; }
.sign-seal-pending { background: #eef3f5; color: #43515c; }
.sign-seal-neutral { background: #eef3f5; color: #43515c; }
.sign-progress-card { min-height: 190px; }
.sign-permission-hint { padding: 8px 10px; border: 1px solid #e2c36f; border-radius: 8px; background: #fff9e8; color: #805a16; font-size: 12px; font-weight: 700; line-height: 1.45; }
.sign-view .sign-demo-action,
.sign-view [data-sign-action="load-approved-demo"] { border-color: #064b45; background: #064b45; color: #fff !important; -webkit-text-fill-color: #fff; font-weight: 900; text-shadow: 0 1px 0 rgba(0,0,0,.18); box-shadow: 0 8px 18px rgba(7,86,79,.24); }
.sign-view .sign-demo-action span,
.sign-view [data-sign-action="load-approved-demo"] span { color: #fff !important; -webkit-text-fill-color: #fff; font-weight: 900; }
.sign-view .sign-demo-action:hover,
.sign-view [data-sign-action="load-approved-demo"]:hover { border-color: #043b36; background: #043b36; color: #fff !important; }
.sign-score-card .sign-demo-action span,
.sign-bottom-bar .sign-demo-action span { color: #fff !important; -webkit-text-fill-color: #fff; }
.sign-prep-row [data-sign-action="load-approved-demo"] { justify-self: start; margin-top: 4px; }
.sign-view .primary-button,
.sign-view .primary-button span,
.sign-view .primary-button i,
.sign-view .primary-button svg { color: #fff !important; -webkit-text-fill-color: #fff; font-weight: 900; }
.sign-action-row .primary-button,
.sign-bottom-bar .primary-button,
.signature-empty-zone .primary-button { border-color: #064b45; background: #064b45; text-shadow: 0 1px 0 rgba(0,0,0,.18); box-shadow: 0 8px 18px rgba(7,86,79,.2); }
.sign-action-row .primary-button:hover,
.sign-bottom-bar .primary-button:hover,
.signature-empty-zone .primary-button:hover { border-color: #043b36; background: #043b36; color: #fff !important; }
.sign-view .ghost-button.is-disabled span,
.sign-view .ghost-button:disabled span { color: #43515c !important; -webkit-text-fill-color: #43515c; }
.sign-role-layout { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(330px,.92fr) minmax(310px,.78fr); gap: 8px; margin-top: 8px; align-items: stretch; }
.sign-operation-panel,
.sign-check-panel,
.sign-log-panel { min-width: 0; }
.sign-log-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.sign-log-header-actions .text-button[hidden] { display: none; }
.sign-readonly-notice { display: grid; gap: 3px; margin: 10px 12px 0; padding: 10px 12px; border: 1px solid #e2c36f; border-left: 4px solid #c8932c; border-radius: 8px; background: #fff9e8; }
.sign-readonly-notice[hidden] { display: none; }
.sign-readonly-notice strong { color: #805a16; font-size: 13px; }
.sign-readonly-notice span { color: #667085; font-size: 12px; }
.sign-prep-card { display: grid; gap: 8px; padding: 12px; }
.sign-prep-row { display: grid; gap: 4px; padding: 10px; border: 1px solid #d8e6df; border-radius: 8px; background: #f7faf8; }
.sign-prep-row span { color: #5f6f78; font-size: 12px; }
.sign-prep-row strong { color: #12343d; font-size: 13px; line-height: 1.35; }
.sign-prep-row em { color: #667085; font-size: 12px; font-style: normal; line-height: 1.45; }
.signature-party-stack { display: grid; gap: 10px; padding: 0 12px 12px; }
.signature-party-card { display: grid; gap: 10px; min-height: 210px; padding: 12px; border: 1px dashed #9fb3bd; border-radius: 8px; background: #fbfcfc; }
.signature-party-card.is-signed { border-style: solid; border-color: #b7d8c5; background: #f6fbf8; }
.signature-party-card header,
.signature-party-card footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.signature-party-card header span { color: #5f6f78; font-size: 12px; font-weight: 800; }
.signature-party-card header strong { color: #12343d; font-size: 14px; line-height: 1.35; }
.signature-empty-zone { display: grid; place-items: center; gap: 8px; min-height: 126px; border: 1px dashed #cbd7dd; border-radius: 8px; background: #fff; text-align: center; }
.signature-empty-zone em { color: #667085; font-size: 12px; font-style: normal; }
.signature-visual { display: grid; place-items: center; min-height: 128px; border: 1px solid #d8e6df; border-radius: 8px; background: #fff; }
.business-seal { position: relative; display: grid; place-items: center; width: 132px; height: 132px; border: 3px solid #b3261e; border-radius: 50%; color: #b3261e; transform: rotate(-8deg); }
.business-seal::before { content: ""; position: absolute; inset: 8px; border: 1px solid rgba(179,38,30,.58); border-radius: 50%; }
.business-seal b { font-size: 28px; line-height: 1; }
.business-seal span { position: absolute; top: 20px; left: 16px; right: 16px; color: #b3261e; font-size: 12px; font-weight: 800; text-align: center; line-height: 1.25; }
.business-seal em { position: absolute; bottom: 22px; color: #b3261e; font-size: 12px; font-style: normal; font-weight: 800; }
.hand-signature { color: #1f5caa; font-family: "Segoe Script", "KaiTi", cursive; font-size: 42px; transform: rotate(-6deg); text-shadow: 0 1px 0 rgba(31,92,170,.12); }
.done-tag { padding: 4px 8px; border-radius: 999px; background: #e7f6ed; color: #0f6b3d; font-size: 12px; font-weight: 800; }
.text-button { border: 0; background: transparent; color: #1f5c76; font-size: 12px; font-weight: 800; cursor: pointer; }
.sign-checklist { display: grid; gap: 8px; padding: 12px; }
.sign-checklist h4,
.sign-process-chain h4,
.sign-history-section h4 { margin: 0; color: #12343d; font-size: 13px; }
.sign-check-item { display: grid; grid-template-columns: 26px minmax(0,1fr); gap: 8px; align-items: start; padding: 10px; border: 1px solid #dce3e6; border-radius: 8px; background: #fff; }
.sign-check-item > span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 999px; background: #eef3f5; color: #667085; font-weight: 900; }
.sign-check-item.is-done { border-color: #b7d8c5; background: #f4fbf7; }
.sign-check-item.is-done > span { background: #0f766e; color: #fff; }
.sign-check-item strong { display: block; color: #12343d; font-size: 13px; }
.sign-check-item em { display: block; margin-top: 4px; color: #667085; font-size: 12px; font-style: normal; line-height: 1.4; }
.sign-process-chain { display: grid; gap: 0; padding: 0 12px 12px; }
.sign-chain-node { position: relative; display: grid; grid-template-columns: 30px minmax(0,1fr); gap: 8px; min-height: 70px; padding: 8px 0; }
.sign-chain-node::after { content: ""; position: absolute; left: 11px; top: 38px; bottom: -22px; border-left: 2px dashed #cfd7dc; }
.sign-chain-node:last-child::after { display: none; }
.sign-chain-node.is-done::after { border-left-style: solid; border-left-color: #0f766e; }
.chain-dot { position: relative; z-index: 1; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 999px; background: #e9eef1; color: #667085; font-size: 11px; font-weight: 900; }
.sign-chain-node.is-done .chain-dot { background: #0f766e; color: #fff; }
.sign-chain-node.is-active .chain-dot { background: #c8932c; color: #fff; animation: signaturePulse 1.5s infinite; }
.sign-chain-node strong { display: block; color: #12343d; font-size: 13px; }
.sign-chain-node em { display: block; margin-top: 4px; color: #667085; font-size: 12px; font-style: normal; }
.sign-log-list { display: grid; gap: 8px; min-height: 184px; max-height: 278px; overflow-y: auto; overflow-x: hidden; padding: 12px; align-content: start; scrollbar-gutter: stable; }
.sign-log-item { display: grid; gap: 4px; padding: 10px; border: 1px solid #d8e6df; border-left: 4px solid #2f6f8f; border-radius: 8px; background: #fff; }
.sign-log-item.is-new { animation: signLogFade .45s ease-out; }
.sign-log-item.is-revoked { border-left-color: #b65c5c; background: #fff7f7; opacity: .82; }
.sign-log-item time { color: #5f6f78; font-size: 12px; }
.sign-log-item strong { color: #12343d; font-size: 13px; }
.sign-log-item span { color: #667085; font-size: 12px; }
.sign-history-section { display: grid; gap: 8px; padding: 0 12px 12px; }
.sign-history-section .sign-history-list { padding: 0; }
.sign-record-group { display: grid; gap: 7px; }
.sign-record-group + .sign-record-group { margin-top: 10px; padding-top: 10px; border-top: 1px solid #e2eaee; }
.sign-record-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sign-record-head strong { color: #12343d; font-size: 12px; }
.sign-record-head span { color: #667085; font-size: 11px; font-weight: 800; }
.compact-empty { min-height: 92px; padding: 10px; }
.sign-history-item { border-left: 4px solid #0f766e; transition: background .18s ease, transform .18s ease; }
.sign-history-item.is-signing { border-left-color: #c8932c; }
.sign-history-item.is-review { border-left-color: #2f6f8f; }
.sign-history-item.is-archive { border-left-color: #7c3aed; }
.sign-history-item.is-archived { border-left-color: #0f766e; }
.sign-history-item small { color: #667085; font-size: 11px; line-height: 1.35; }
.history-status { padding: 3px 7px; border-radius: 999px; font-size: 11px; font-weight: 900; }
.history-status.is-signing { background: #fff6df; color: #8a5a00; }
.history-status.is-review { background: #e8f1ff; color: #1d4f91; }
.history-status.is-archive { background: #f6eefe; color: #6b21a8; }
.history-status.is-archived { background: #e7f6ed; color: #0f6b3d; }
.history-status.is-pending { background: #eef3f5; color: #43515c; }
.sign-history-item:hover { background: #f4fbf7; transform: translateY(-1px); }
.sign-bottom-bar { display: flex; align-items: center; justify-content: flex-end; gap: 10px; min-height: 58px; margin-top: 8px; padding: 10px 14px; border: 1px solid #d8e6df; border-radius: 8px; background: #f7faf8; }
.sign-bottom-bar[hidden] { display: none; }
.sign-bottom-bar span { color: #43515c; font-size: 13px; font-weight: 800; }
.compact-tool.is-pulse,
.primary-button.is-pulse { animation: signaturePulse 1.5s infinite; }
.primary-button.is-loading,
.ghost-button.is-loading { opacity: .78; cursor: wait; }
@keyframes signaturePulse {
  0% { box-shadow: 0 0 0 0 rgba(200,147,44,.34); }
  70% { box-shadow: 0 0 0 8px rgba(200,147,44,0); }
  100% { box-shadow: 0 0 0 0 rgba(200,147,44,0); }
}
@keyframes signLogFade {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 1280px) {
  .sign-role-layout { grid-template-columns: 1fr 1fr; }
  .sign-log-panel { grid-column: 1 / -1; }
}
@media (max-width: 860px) {
  .sign-role-hero,
  .sign-role-layout { grid-template-columns: 1fr; }
  .sign-bottom-bar { justify-content: flex-start; flex-wrap: wrap; }
}
/* Performance overview dashboard */
.performance-view { display: grid; gap: 12px; }
.performance-hero {
  display: grid;
  grid-template-columns: minmax(0,1fr) max-content;
  align-items: start;
  gap: 14px;
  margin-top: 10px;
  padding: 0;
  border: 0;
  background: transparent;
}
.performance-decision-card {
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  align-items: start;
  gap: 7px 12px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid #cfe3e0;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: linear-gradient(90deg, #fff, #f6fbfa);
  box-shadow: 0 10px 24px rgba(20,60,63,.05);
}
.performance-decision-card span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  background: #e9f6ef;
  color: var(--brand);
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}
.performance-decision-card strong { color: #0b4f4a; font-size: 16px; line-height: 1.35; white-space: normal; }
.performance-decision-card p { grid-column: 2; margin: 0; color: var(--muted-strong); font-size: 13px; line-height: 1.55; }
.performance-update-meta { margin-left: 0; }
@media (max-width: 760px) {
  .performance-hero { grid-template-columns: 1fr; }
  .performance-update-meta { justify-self: start; }
  .performance-decision-card { grid-template-columns: 1fr; gap: 6px; }
  .performance-decision-card p { grid-column: 1; }
}
.performance-kpi-board {
  display: grid;
  grid-template-columns: repeat(6, minmax(150px,1fr));
  gap: 10px;
  min-height: 150px;
}
.performance-kpi-card {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr);
  gap: 10px;
  align-items: start;
  min-height: 132px;
  padding: 14px;
  border: 1px solid var(--line);
  border-top: 3px solid var(--brand);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(20,60,63,.05);
}
.performance-kpi-card.red { border-top-color: var(--red); }
.performance-kpi-card.amber { border-top-color: var(--amber); }
.performance-kpi-card.green { border-top-color: var(--green); }
.performance-kpi-card.blue { border-top-color: var(--brand-2); }
.performance-kpi-card.slate { border-top-color: var(--slate); }
.performance-kpi-card span, .performance-kpi-card strong, .performance-kpi-card em { display: block; }
.performance-kpi-card div > span { color: var(--muted); font-size: 12px; }
.performance-kpi-card strong { margin-top: 8px; font-size: 20px; line-height: 1.22; overflow-wrap: anywhere; }
.performance-kpi-card em { margin-top: 7px; color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.4; }
.performance-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
  align-items: stretch;
}
.performance-ai-panel { grid-column: 1 / 2; }
.performance-node-panel { grid-column: 2 / 3; }
.performance-table-panel { grid-column: 1 / -1; }
.performance-filter-row { display: flex; flex-wrap: wrap; gap: 7px; justify-content: flex-end; align-items: center; }
.performance-ai-insights { display: grid; gap: 10px; padding: 13px 16px 16px; }
.performance-ai-focus {
  display: grid;
  gap: 7px;
  padding: 12px;
  border: 1px solid #d8e6df;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #f7faf8;
}
.performance-ai-focus.high { border-left-color: var(--red); background: #fff7f6; }
.performance-ai-focus.medium { border-left-color: var(--amber); background: #fffaf0; }
.performance-ai-focus.low { border-left-color: var(--green); background: #f4fbf7; }
.performance-ai-focus span { color: var(--muted); font-size: 12px; }
.performance-ai-focus strong { font-size: 14px; line-height: 1.35; }
.performance-ai-focus p { color: var(--muted-strong); }
.performance-ai-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.performance-ai-grid div {
  min-height: 78px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.performance-ai-grid span, .performance-ai-grid strong, .performance-ai-grid em { display: block; }
.performance-ai-grid span { color: var(--muted); font-size: 12px; }
.performance-ai-grid strong { margin-top: 5px; font-size: 13px; line-height: 1.35; }
.performance-ai-grid em { margin-top: 4px; color: var(--muted-strong); font-size: 11px; font-style: normal; line-height: 1.35; }
.performance-ai-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 3px;
}
.performance-ai-meta-row em {
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.76);
  color: var(--muted-strong);
  font-size: 11px;
  font-style: normal;
  line-height: 1.3;
}
.performance-ai-grid-rich { grid-template-columns: repeat(3, minmax(0,1fr)); }
.performance-ai-grid-rich div { min-height: 96px; }
.performance-ai-grid-rich em { min-height: 34px; }
.performance-ai-action-board {
  display: grid;
  grid-template-columns: minmax(0,1.25fr) minmax(0,.75fr);
  gap: 8px;
}
.performance-ai-action-board section {
  min-height: 126px;
  padding: 11px;
  border: 1px solid #d7e5e1;
  border-radius: 8px;
  background: #fff;
}
.performance-ai-action-board section > span {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.performance-ai-action-board p {
  display: grid;
  grid-template-columns: 20px minmax(0,1fr);
  gap: 7px;
  margin: 0 0 8px;
  color: var(--muted-strong);
  font-size: 12px;
  line-height: 1.45;
}
.performance-ai-action-board p:last-child { margin-bottom: 0; }
.performance-ai-action-board b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #e9f6ef;
  color: var(--brand);
  font-size: 11px;
}
.performance-ai-evidence { display: flex; flex-wrap: wrap; gap: 7px; }
.performance-ai-evidence em {
  padding: 5px 8px;
  border-radius: 999px;
  background: #f3f7f8;
  color: #30525a;
  font-size: 11px;
  font-style: normal;
  line-height: 1.3;
}
.performance-node-list { display: grid; gap: 8px; padding: 13px 16px 16px; }
.performance-node-item {
  display: grid;
  gap: 4px;
  width: 100%;
  padding: 10px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
}
.performance-node-item:hover { border-color: var(--brand); background: #f4fbfa; }
.performance-node-item.high { border-left-color: var(--red); }
.performance-node-item.medium { border-left-color: var(--amber); }
.performance-node-item.low { border-left-color: var(--green); }
.performance-node-item strong { font-size: 13px; }
.performance-node-item span, .performance-node-item em { color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.35; }
.performance-table-wrap { padding-top: 8px; overflow: hidden; }
.performance-table { width: 100%; min-width: 0; table-layout: fixed; border-collapse: separate; border-spacing: 0; }
.performance-table thead { display: table; width: calc(100% - 12px); table-layout: fixed; }
.performance-table thead th { position: static; background: #f7faf8; box-shadow: 0 1px 0 var(--line); }
.performance-table tbody { display: block; max-height: 640px; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; scrollbar-gutter: stable; }
.performance-table th, .performance-table td { box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; padding: 8px 7px; }
.performance-table td strong, .performance-table td span { overflow: hidden; text-overflow: ellipsis; }
.performance-table th:nth-child(1), .performance-table td:nth-child(1) { width: 9%; }
.performance-table th:nth-child(2), .performance-table td:nth-child(2) { width: 16%; }
.performance-table th:nth-child(3), .performance-table td:nth-child(3) { width: 7%; }
.performance-table th:nth-child(4), .performance-table td:nth-child(4) { width: 7%; }
.performance-table th:nth-child(5), .performance-table td:nth-child(5) { width: 10%; }
.performance-table th:nth-child(6), .performance-table td:nth-child(6) { width: 6.5%; }
.performance-table th:nth-child(7), .performance-table td:nth-child(7) { width: 6.5%; }
.performance-table th:nth-child(8), .performance-table td:nth-child(8) { width: 7%; }
.performance-table th:nth-child(9), .performance-table td:nth-child(9) { width: 6.5%; }
.performance-table th:nth-child(10), .performance-table td:nth-child(10) { width: 6.5%; }
.performance-table th:nth-child(11), .performance-table td:nth-child(11) { width: 7%; }
.performance-table th:nth-child(12), .performance-table td:nth-child(12) { width: 6%; }
.performance-table th:nth-child(13), .performance-table td:nth-child(13) { width: 11%; }
.performance-table tbody tr { display: table; width: 100%; table-layout: fixed; cursor: pointer; }
.performance-table tbody tr:hover, .performance-table tbody tr.is-selected { background: #f4fbfa; }
.performance-table tbody tr.is-selected { box-shadow: inset 4px 0 0 var(--brand); }
.performance-stage-pill, .status-chip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #eef7f8;
  color: var(--brand-2);
  font-size: 12px;
  white-space: nowrap;
}
.status-chip.normal { background: #e9f6ef; color: var(--green); }
.status-chip.warn { background: #fff7e3; color: var(--amber); }
.status-chip.danger { background: #fff1ef; color: var(--red); }
.status-chip.done { background: #eef2f6; color: var(--slate); }
.progress-cell { display: grid; grid-template-columns: 38px minmax(0,1fr); align-items: center; gap: 6px; min-width: 0; }
.progress-cell span { margin: 0; color: var(--brand); font-weight: 700; }
.progress-cell.amber span { color: var(--amber); }
.progress-cell.amber .bar-fill { background: var(--amber); }
.performance-table .risk-badge.low { background: #e9f6ef; color: var(--green); }
.performance-table .risk-badge.medium { background: #fff7e3; color: var(--amber); }
.performance-table .risk-badge.high { background: #fff1ef; color: var(--red); }
@media (max-width: 1400px) {
  .performance-kpi-board { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 1100px) {
  .performance-layout { grid-template-columns: 1fr; }
  .performance-ai-panel, .performance-node-panel, .performance-table-panel { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .performance-hero { grid-template-columns: 1fr; }
  .performance-kpi-board, .performance-ai-grid, .performance-ai-action-board { grid-template-columns: 1fr; }
  .performance-filter-row { justify-content: flex-start; }
}
/* Production-like copy cleanup: presenter notes stay outside the system UI */
.login-copy > p,
.login-card > p,
.panel-header p,
.review-hero > div > p,
.compare-hero > div > p,
.sign-hero-copy > p,
.review-score-card p,
.compare-score-card p,
.sign-score-card p,
.review-hero-insights em,
.compare-hero-insights em,
.sign-hero-insights em {
  display: none !important;
}
.panel-header { align-items: center; }
.review-hero,
.compare-hero,
.sign-hero,
.performance-hero { align-items: center; }
/* Review header C layout: horizontal progress and compact action rail */
.title-block .breadcrumb {
  align-self: center;
  color: var(--muted-strong);
  font-size: 16px;
  font-weight: 800;
  line-height: 1;
  padding-bottom: 0;
}
.title-block h1 {
  align-self: center;
  color: var(--text);
  font-size: 20px;
  font-weight: 850;
  line-height: 1;
  padding-bottom: 0;
}
.review-hero {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 10px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #fff;
  align-items: stretch;
}
.review-view.is-launch-mode .review-hero {
  border-left-color: var(--amber);
}
.review-timeline-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(170px,180px);
  align-items: center;
  gap: 10px;
  min-height: 66px;
}
.review-workspace-view .review-timeline-row {
  grid-template-columns: minmax(0,1fr) minmax(430px,540px);
}
.review-workspace-view.is-review-started .review-timeline-row {
  grid-template-columns: minmax(0,1fr) minmax(500px,540px);
}
.review-hero .review-progress-steps {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 8px;
  min-width: 0;
  margin: 0;
}
.review-hero .review-progress-steps::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 10%;
  right: 10%;
  border-top: 1px dashed #b9c8ca;
  pointer-events: none;
}
.review-hero .review-progress-step {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 5px;
  min-height: 58px;
  padding: 0 2px;
  border: 0;
  background: transparent;
  box-shadow: none;
  opacity: 1;
  text-align: center;
}
.review-hero .review-progress-step > span {
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #496070;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
}
.review-hero .review-progress-step.is-done > span {
  background: var(--brand);
}
.review-hero .review-progress-step.is-active > span {
  background: var(--amber);
}
.review-hero .review-progress-step strong {
  color: var(--text);
  font-size: 12px;
  line-height: 1.2;
}
.review-hero .review-progress-step em {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  line-height: 1.15;
}
.review-hero .review-progress-step p {
  display: none !important;
}
.review-hero .review-progress-step.is-active {
  transform: none;
  box-shadow: none;
}
.review-score-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
  align-self: stretch;
}
.review-workspace-view .review-score-actions {
  grid-template-columns: repeat(2, minmax(0,1fr));
}
.review-score-actions .compact-tool {
  justify-content: center;
  width: 100%;
  min-height: 32px;
  border-radius: 8px;
  white-space: nowrap;
}
.review-meta-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  align-items: center;
  gap: 0;
  min-height: 36px;
  padding-top: 8px;
  border-top: 1px solid #e3ebec;
}
.review-hero-insights {
  display: contents;
}
.review-hero-insights div,
.review-meta-item {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  min-height: 28px;
  height: auto;
  padding: 0 12px;
  border: 0;
  border-right: 1px solid #d5e0e1;
  border-radius: 0;
  background: transparent;
  color: var(--text);
}
.review-meta-strip > *:last-child,
.review-meta-strip > *:nth-last-child(2),
.review-meta-strip > *:nth-last-child(3) {
  border-right: 0;
}
.review-hero-insights span,
.review-meta-item span {
  flex: 0 0 auto;
  color: var(--muted-strong);
  font-size: 12px;
  white-space: nowrap;
}
.review-hero-insights span::after {
  content: "：";
}
.review-hero-insights strong,
.review-meta-item strong {
  min-width: 0;
  color: var(--text);
  font-size: 12px;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.review-meta-item i,
.review-meta-item svg {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  color: #496070;
}
.review-hero-insights em,
.review-readiness-value,
.review-readiness-note {
  display: none !important;
}
@media (max-width: 1280px) {
  .review-workspace-view .review-timeline-row,
  .review-workspace-view.is-review-started .review-timeline-row {
    grid-template-columns: minmax(0,1fr) minmax(390px,460px);
  }
  .review-score-actions .compact-tool span {
    font-size: 12px;
  }
}
@media (max-width: 1100px) {
  .review-timeline-row,
  .review-workspace-view .review-timeline-row,
  .review-workspace-view.is-review-started .review-timeline-row {
    grid-template-columns: 1fr;
  }
  .review-workspace-view .review-score-actions {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .review-meta-strip {
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 6px;
  }
  .review-hero-insights div,
  .review-meta-item {
    border-right: 0;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 7px 9px;
  }
}
@media (max-width: 620px) {
  .review-hero .review-progress-steps,
  .review-workspace-view .review-score-actions,
  .review-meta-strip {
    grid-template-columns: 1fr;
  }
  .review-hero .review-progress-steps::before {
    display: none;
  }
}

/* Review progress polish: animated rail, no numeric percentages */
.review-hero .review-progress-steps.is-running::after {
  content: "";
  position: absolute;
  top: 10px;
  left: 10%;
  right: 10%;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent 0%, rgba(184,132,34,.2) 22%, var(--amber) 50%, rgba(184,132,34,.2) 78%, transparent 100%);
  background-size: 220% 100%;
  animation: reviewRailFlow 1.25s linear infinite;
  pointer-events: none;
}
.review-hero .review-progress-steps.is-complete::before {
  border-top-color: rgba(15,118,110,.42);
}
.review-hero .review-progress-step strong {
  color: #102a38;
  font-size: 12px;
  font-weight: 800;
}
.review-hero .review-progress-step em {
  color: #5f727b;
  font-size: 11px;
  font-weight: 600;
}
.review-hero .review-progress-step.is-done strong,
.review-hero .review-progress-step.is-done em {
  color: var(--brand);
}
.review-hero .review-progress-step.is-active strong,
.review-hero .review-progress-step.is-active em {
  color: #9a6516;
}
.review-hero .review-progress-step.is-active > span {
  animation: reviewNodePulse 1.1s ease-in-out infinite;
}
.review-meta-strip {
  min-height: 42px;
  padding: 8px 8px 0;
  background: linear-gradient(180deg, #fff, #fbfdfc);
}
.review-hero-insights div,
.review-meta-item {
  min-height: 34px;
  padding: 0 14px;
}
.review-hero-insights i,
.review-hero-insights svg,
.review-meta-item i,
.review-meta-item svg {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  color: #385762;
}
.review-hero-insights span,
.review-meta-item span {
  color: #334b55;
  font-weight: 650;
}
.review-hero-insights strong,
.review-meta-item strong {
  color: #071d2a;
  font-weight: 800;
}
@keyframes reviewRailFlow {
  from { background-position: 120% 0; }
  to { background-position: -120% 0; }
}
@keyframes reviewNodePulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(184,132,34,.34); }
  50% { box-shadow: 0 0 0 6px rgba(184,132,34,0); }
}

/* Review header alignment fixes */
.review-timeline-row {
  grid-template-columns: minmax(0,1fr) auto;
}
.review-workspace-view .review-timeline-row,
.review-workspace-view.is-review-started .review-timeline-row {
  grid-template-columns: minmax(0,1fr) auto;
}
.review-hero .review-progress-step {
  grid-template-rows: 20px auto;
  align-content: start;
  align-items: start;
}
.review-hero .review-progress-step > div {
  display: grid;
  justify-items: center;
  gap: 2px;
  min-width: 0;
}
.review-hero .review-progress-step strong,
.review-hero .review-progress-step em {
  text-align: center;
  white-space: nowrap;
}
.review-score-actions {
  justify-self: end;
  align-self: center;
  width: 180px;
}
.review-workspace-view .review-score-actions {
  justify-self: end;
  width: 540px;
  max-width: min(540px, 40vw);
}
.review-workspace-view.is-review-started .review-score-actions {
  width: 540px;
  max-width: min(540px, 42vw);
}
.review-score-actions .compact-tool {
  min-height: 36px;
  font-size: 13px;
  font-weight: 800;
}
.review-score-actions .compact-tool span {
  font-size: 13px;
  font-weight: 800;
  line-height: 1.15;
}
.review-score-actions .compact-tool svg,
.review-score-actions .compact-tool i {
  width: 17px;
  height: 17px;
}
#startReview span,
#startReviewWorkspace span {
  font-size: 13.5px;
}
@media (max-width: 1280px) {
  .review-workspace-view .review-score-actions,
  .review-workspace-view.is-review-started .review-score-actions {
    width: 460px;
    max-width: min(460px, 42vw);
  }
}
@media (max-width: 1100px) {
  .review-score-actions,
  .review-workspace-view .review-score-actions,
  .review-workspace-view.is-review-started .review-score-actions {
    justify-self: stretch;
    width: 100%;
    max-width: none;
  }
}

/* Review header force update: visible node stacking and right-aligned actions */
.review-hero .review-progress-steps::before {
  top: 9px !important;
}
.review-hero .review-progress-steps.is-running::after {
  top: 9px !important;
}
.review-hero .review-progress-step {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  min-height: 74px !important;
  padding: 0 4px !important;
  gap: 0 !important;
}
.review-hero .review-progress-step > span {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  width: 20px !important;
  height: 20px !important;
  margin: 0 0 9px !important;
  font-size: 11px !important;
}
.review-hero .review-progress-step > div {
  position: relative;
  z-index: 2;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 3px !important;
  min-width: 0;
  padding: 0 5px;
  background: #fff;
}
.review-hero .review-progress-step strong {
  display: block !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1.15 !important;
  text-align: center !important;
  white-space: nowrap !important;
}
.review-hero .review-progress-step em {
  display: block !important;
  margin: 0 !important;
  font-size: 11.5px !important;
  font-weight: 650 !important;
  line-height: 1.15 !important;
  text-align: center !important;
  white-space: nowrap !important;
}
.review-timeline-row {
  align-items: center !important;
  min-height: 88px !important;
}
.review-score-actions {
  justify-self: end !important;
  align-self: center !important;
}
.review-workspace-view .review-score-actions,
.review-workspace-view.is-review-started .review-score-actions {
  width: 500px !important;
  max-width: 500px !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.review-score-actions .compact-tool {
  min-height: 38px !important;
  font-size: 14px !important;
  font-weight: 850 !important;
}
.review-score-actions .compact-tool span {
  font-size: 14px !important;
  font-weight: 850 !important;
  line-height: 1.1 !important;
}
.review-score-actions .compact-tool svg,
.review-score-actions .compact-tool i {
  width: 18px !important;
  height: 18px !important;
}
#startReview,
#startReviewWorkspace {
  min-height: 40px !important;
}
#startReview span,
#startReviewWorkspace span {
  font-size: 14.5px !important;
}
.review-meta-strip {
  margin-top: 0 !important;
}
@media (max-width: 1380px) {
  .review-workspace-view .review-score-actions,
  .review-workspace-view.is-review-started .review-score-actions {
    width: 460px !important;
    max-width: 460px !important;
  }
}
@media (max-width: 1180px) {
  .review-workspace-view .review-score-actions,
  .review-workspace-view.is-review-started .review-score-actions,
  .review-score-actions {
    justify-self: stretch !important;
    width: 100% !important;
    max-width: none !important;
  }
}

/* Review workspace final split: progress and meta on the left, actions on the far right */
.review-workspace-view .review-hero {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 500px !important;
  grid-template-areas:
    "progress actions"
    "meta actions" !important;
  column-gap: 14px !important;
  row-gap: 4px !important;
  align-items: stretch !important;
}
.review-workspace-view .review-timeline-row {
  display: contents !important;
  min-height: 0 !important;
}
.review-workspace-view .review-progress-steps {
  grid-area: progress !important;
  align-self: center !important;
}
.review-workspace-view .review-meta-strip {
  grid-area: meta !important;
  align-self: start !important;
  width: 100% !important;
  margin-top: 0 !important;
  padding-top: 6px !important;
}
.review-workspace-view .review-score-actions {
  grid-area: actions !important;
  align-self: center !important;
  justify-self: end !important;
  width: 500px !important;
  max-width: 500px !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.review-workspace-view .review-score-actions .compact-tool {
  min-height: 40px !important;
}
.review-workspace-view .review-hero-insights div,
.review-workspace-view .review-meta-item {
  padding-inline: 10px !important;
}
#reviewView .review-hero {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 220px !important;
  grid-template-areas:
    "progress actions"
    "meta meta" !important;
  column-gap: 12px !important;
  row-gap: 4px !important;
}
#reviewView .review-timeline-row {
  display: contents !important;
  min-height: 0 !important;
}
#reviewView .review-progress-steps {
  grid-area: progress !important;
}
#reviewView .review-score-actions {
  grid-area: actions !important;
  width: 220px !important;
  justify-self: end !important;
}
#reviewView .review-meta-strip {
  grid-area: meta !important;
}
@media (max-width: 1380px) {
  .review-workspace-view .review-hero {
    grid-template-columns: minmax(0, 1fr) 460px !important;
  }
  .review-workspace-view .review-score-actions {
    width: 460px !important;
    max-width: 460px !important;
  }
}
@media (max-width: 1180px) {
  .review-workspace-view .review-hero,
  #reviewView .review-hero {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "progress"
      "actions"
      "meta" !important;
  }
  .review-workspace-view .review-score-actions,
  #reviewView .review-score-actions {
    justify-self: stretch !important;
    width: 100% !important;
    max-width: none !important;
  }
}

/* Risk warning center */
.risk-center-view.is-active {
  display: grid;
  gap: 12px;
}
.risk-center-hero {
  display: grid;
  grid-template-columns: minmax(0,1fr) 430px;
  gap: 12px;
  align-items: stretch;
}
.risk-decision-card {
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  gap: 8px 12px;
  align-items: start;
  padding: 14px 16px;
  border: 1px solid #d7e5e1;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: linear-gradient(180deg,#fbfdfc 0%,#f5faf8 100%);
}
.risk-decision-card span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 0 9px;
  border-radius: 999px;
  background: #e9f6ef;
  color: var(--brand);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.risk-decision-card strong { color: #0b4f4a; font-size: 16px; line-height: 1.35; }
.risk-decision-card p { grid-column: 2; margin: 0; color: var(--muted-strong); font-size: 13px; line-height: 1.55; }
.risk-meta-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 8px;
}
.risk-meta-grid div {
  display: grid;
  align-content: center;
  gap: 5px;
  min-height: 82px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.risk-meta-grid span, .risk-meta-grid strong { display: block; min-width: 0; }
.risk-meta-grid span { color: var(--muted); font-size: 12px; }
.risk-meta-grid strong { color: #173f46; font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
.risk-kpi-board {
  display: grid;
  grid-template-columns: repeat(6,minmax(145px,1fr));
  gap: 10px;
}
.risk-kpi-card {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr);
  gap: 10px;
  min-height: 118px;
  padding: 13px;
  border: 1px solid var(--line);
  border-top: 3px solid var(--brand-2);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(20,60,63,.05);
}
.risk-kpi-card.red { border-top-color: var(--red); }
.risk-kpi-card.amber { border-top-color: var(--amber); }
.risk-kpi-card.green { border-top-color: var(--green); }
.risk-kpi-card.slate { border-top-color: var(--slate); }
.risk-kpi-card span, .risk-kpi-card strong, .risk-kpi-card em { display: block; }
.risk-kpi-card div > span { color: var(--muted); font-size: 12px; }
.risk-kpi-card strong { margin-top: 7px; color: var(--text); font-size: 20px; line-height: 1.2; overflow-wrap: anywhere; }
.risk-kpi-card em { margin-top: 6px; color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.35; }
.risk-center-layout {
  --risk-primary-body-height: 490px;
  display: grid;
  grid-template-columns: repeat(12,minmax(0,1fr));
  gap: 12px;
  align-items: stretch;
  grid-auto-flow: dense;
}
.risk-list-panel,
.risk-detail-panel,
.risk-advice-panel { display: flex; flex-direction: column; min-height: 0; }
.risk-list-panel { grid-column: 1 / span 4; grid-row: 1; }
.risk-detail-panel { grid-column: 5 / span 5; grid-row: 1; }
.risk-advice-panel { grid-column: 10 / span 3; grid-row: 1; }
.risk-trend-panel { grid-column: 1 / span 4; grid-row: 2; min-height: 320px; }
.risk-matrix-panel { grid-column: 5 / span 4; grid-row: 2; min-height: 320px; }
.risk-ranking-panel { grid-column: 9 / span 4; grid-row: 2; min-height: 320px; }
.risk-trend-panel, .risk-matrix-panel, .risk-ranking-panel { display: flex; flex-direction: column; }
.risk-filter-row {
  display: grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap: 6px;
  min-height: 50px;
  padding: 12px 14px 0;
}
.risk-filter-row .ghost-button {
  min-width: 0;
  justify-content: center;
  padding-inline: 7px;
  font-size: 12px;
  white-space: nowrap;
}
.risk-filter-row .ghost-button.is-active { border-color: var(--brand); background: #f4fbfa; color: var(--brand); }
.risk-filter-row span { margin-left: 5px; color: inherit; font-weight: 800; }
.risk-list-panel > .panel-header,
.risk-filter-row { flex: 0 0 auto; }
.risk-alert-list {
  display: grid;
  gap: 10px;
  flex: 0 0 auto;
  height: calc(var(--risk-primary-body-height) - 76px);
  min-height: 0;
  max-height: calc(var(--risk-primary-body-height) - 76px);
  margin: 12px 14px 14px;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0;
  clip-path: inset(0 round 8px);
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.risk-alert-item {
  display: grid;
  gap: 9px;
  width: 100%;
  min-height: 96px;
  padding: 13px 14px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand-2);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
}
.risk-alert-item.high { border-left-color: var(--red); }
.risk-alert-item.medium { border-left-color: var(--amber); }
.risk-alert-item.low { border-left-color: var(--green); }
.risk-alert-item:hover, .risk-alert-item.is-active { border-color: var(--brand); background: #f4fbfa; box-shadow: inset 3px 0 0 var(--brand); }
.risk-alert-item.is-empty {
  border-left-color: #c7d8d5;
  background: #f8fbfa;
  color: var(--muted);
  cursor: default;
}
.risk-alert-item.is-empty:hover {
  border-color: var(--line);
  background: #f8fbfa;
  box-shadow: none;
}
.risk-alert-item.is-empty strong,
.risk-alert-item.is-empty p,
.risk-alert-item.is-empty em,
.risk-alert-item.is-empty b {
  color: var(--muted);
}
.risk-alert-item div, .risk-alert-item footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.risk-alert-item strong { font-size: 13px; line-height: 1.4; }
.risk-alert-item p { margin: 0; color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.risk-alert-item em, .risk-alert-item b { color: var(--muted); font-size: 12px; font-style: normal; font-weight: 700; }
.risk-level {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}
.risk-level.high, .risk-text.high { color: var(--red); }
.risk-level.medium, .risk-text.medium { color: var(--amber); }
.risk-level.low, .risk-text.low { color: var(--green); }
.risk-level.high { background: #fff1ef; }
.risk-level.medium { background: #fff7e3; }
.risk-level.low { background: #e9f6ef; }
.risk-detail-content, .risk-advice-content { display: grid; gap: 10px; flex: 0 0 auto; height: var(--risk-primary-body-height); min-height: 0; padding: 12px 14px 14px; }
.risk-detail-content { grid-template-rows: auto auto minmax(0,1fr); }
.risk-advice-content { align-items: stretch; }
.risk-detail-main {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 8px;
  padding: 11px;
  border: 1px solid #d8e6df;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #f7faf8;
}
.risk-detail-main.high { border-left-color: var(--red); background: #fff7f6; }
.risk-detail-main.medium { border-left-color: var(--amber); background: #fffaf0; }
.risk-detail-main.low { border-left-color: var(--green); background: #f4fbf7; }
.risk-detail-main.is-empty { border-left-color: #c7d8d5; background: #f8fbfa; }
.risk-detail-main div { min-width: 0; }
.risk-detail-main span, .risk-detail-main strong { display: block; min-width: 0; }
.risk-detail-main span { color: var(--muted); font-size: 12px; }
.risk-detail-main strong { margin-top: 4px; font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
.risk-trigger-box {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.risk-trigger-box span { display: block; color: var(--muted); font-size: 12px; font-weight: 700; }
.risk-trigger-box p { display: block !important; margin: 6px 0 0; color: var(--muted-strong); font-size: 13px; line-height: 1.5; }
.risk-trigger-box.is-empty { background: #f8fbfa; }
.risk-trigger-box.is-empty p { color: var(--muted); }
.risk-evidence-chain {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap: 10px;
  align-self: stretch;
  margin: 0;
  padding: 2px 0 0;
  list-style: none;
}
.risk-evidence-chain::before {
  content: "";
  position: absolute;
  left: 34px;
  right: 34px;
  top: 18px;
  height: 1px;
  background: #c9dadd;
}
.risk-evidence-chain li {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: auto auto auto 1fr;
  justify-items: center;
  gap: 5px;
  min-height: 122px;
  padding: 0 7px 8px;
  text-align: center;
}
.risk-evidence-chain li > span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid #c9dadd;
  border-radius: 999px;
  background: #f3f8f8;
  box-shadow: 0 0 0 4px #fff;
  color: var(--brand);
}
.risk-evidence-chain li > span i,
.risk-evidence-chain li > span svg { width: 16px; height: 16px; }
.risk-evidence-chain li.is-empty > span { color: var(--muted); background: #f8fbfa; }
.risk-evidence-chain strong,
.risk-evidence-chain b,
.risk-evidence-chain em { display: block; min-width: 0; max-width: 100%; }
.risk-evidence-chain strong { margin-top: 2px; color: var(--ink); font-size: 13px; line-height: 1.25; }
.risk-evidence-chain b { color: var(--brand); font-size: 12px; line-height: 1.38; font-weight: 800; overflow-wrap: anywhere; }
.risk-evidence-chain em { color: var(--muted); font-size: 11.5px; font-style: normal; line-height: 1.38; overflow-wrap: anywhere; }
.risk-advice-summary {
  padding: 12px;
  border: 1px solid #d8e6df;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #f7faf8;
}
.risk-advice-summary.high { border-left-color: var(--red); background: #fff7f6; }
.risk-advice-summary.medium { border-left-color: var(--amber); background: #fffaf0; }
.risk-advice-summary.low { border-left-color: var(--green); background: #f4fbf7; }
.risk-advice-summary span, .risk-advice-summary strong { display: block; }
.risk-advice-summary span { color: var(--muted); font-size: 12px; }
.risk-advice-summary strong { margin-top: 4px; font-size: 15px; }
.risk-advice-summary p { display: block !important; margin: 7px 0 0; color: var(--muted-strong); font-size: 13px; line-height: 1.5; }

.risk-progress {
  display: grid;
  grid-template-columns: auto auto minmax(0,1fr);
  gap: 8px;
  align-items: center;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.risk-progress span { color: var(--muted); font-size: 12px; font-weight: 700; }
.risk-progress strong { color: var(--brand); font-size: 16px; }

.risk-trend-chart { flex: 1 1 auto; min-height: 0; padding: 6px 8px 8px; }
.risk-trend-chart svg { display: block; width: 100%; height: 100%; min-height: 292px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.risk-trend-chart text { font-family: inherit; }
.risk-matrix {
  display: grid;
  grid-template-columns: 18px 34px minmax(0,1fr);
  grid-template-rows: minmax(0,1fr) auto auto;
  gap: 7px 8px;
  flex: 1 1 auto;
  min-height: 0;
  padding: 12px 14px 14px;
}
.risk-matrix-y-title {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  justify-self: center;
  color: #415e64;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
  writing-mode: vertical-rl;
  transform: none;
}
.risk-matrix-likelihood-labels {
  display: grid;
  grid-column: 2;
  grid-row: 1;
  grid-template-rows: repeat(3,minmax(0,1fr));
  align-items: center;
  color: #415e64;
  font-size: 12px;
  font-weight: 900;
  text-align: center;
}
.risk-matrix-grid {
  display: grid;
  grid-column: 3;
  grid-row: 1;
  grid-template-columns: repeat(3,minmax(0,1fr));
  grid-template-rows: repeat(3,minmax(0,1fr));
  gap: 7px;
  min-height: 0;
}
.risk-matrix-cell {
  display: grid;
  place-items: center;
  gap: 5px;
  min-width: 0;
  min-height: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: center;
}
.risk-matrix-cell.high { border-color: #efc6bf; background: #fff5f3; box-shadow: inset 0 3px 0 var(--red); }
.risk-matrix-cell.medium { border-color: #ead6a8; background: #fffaf0; box-shadow: inset 0 3px 0 var(--amber); }
.risk-matrix-cell.low { border-color: #c7e5d4; background: #f4fbf7; box-shadow: inset 0 3px 0 var(--green); }
.risk-matrix-cell:hover { border-color: var(--brand); background: #f4fbfa; color: var(--brand); }
.risk-matrix-cell:disabled { opacity: .82; cursor: default; }
.risk-matrix-cell:disabled:hover { border-color: var(--line); color: var(--text); }
.risk-matrix-cell strong { color: var(--text); font-size: 14px; line-height: 1.25; }
.risk-matrix-cell span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  min-height: 22px;
  padding: 2px 8px;
  border: 1px solid currentColor;
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
}
.risk-matrix-cell.high span { color: #b83b31; }
.risk-matrix-cell.medium span { color: #9b6a12; }
.risk-matrix-cell.low span { color: #167248; }
.risk-matrix-impact-labels {
  display: grid;
  grid-column: 3;
  grid-row: 2;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 7px;
  color: #415e64;
  font-size: 12px;
  font-weight: 900;
  text-align: center;
}
.risk-matrix-x-title { grid-column: 3; grid-row: 3; color: #415e64; font-size: 12px; font-weight: 900; text-align: center; }
.risk-rank-level {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  min-height: 22px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}
.risk-rank-level.high { background: #fff1ef; color: var(--red); }
.risk-rank-level.medium { background: #fff7e3; color: var(--amber); }
.risk-rank-level.low { background: #e9f6ef; color: var(--green); }
.risk-ranking { display: grid; grid-template-rows: auto repeat(5,1fr); gap: 7px; flex: 1 1 auto; min-height: 0; padding: 12px 14px 14px; }
.risk-rank-header,
.risk-rank-row {
  display: grid;
  grid-template-columns: 34px 96px minmax(0,1fr) 76px 64px;
  gap: 8px;
  align-items: center;
}
.risk-rank-header {
  padding: 0 10px 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.risk-rank-row {
  width: 100%;
  min-height: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand-2);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
}
.risk-rank-row.high { border-left-color: var(--red); }
.risk-rank-row.medium { border-left-color: var(--amber); }
.risk-rank-row.low { border-left-color: var(--green); }
.risk-rank-row:hover { border-color: var(--brand); background: #f4fbfa; color: var(--brand); }
.risk-rank-row.is-empty {
  border-left-color: #c7d8d5;
  background: #f8fbfa;
  color: var(--muted);
  cursor: default;
}
.risk-rank-row.is-empty:hover { border-color: var(--line); background: #f8fbfa; color: var(--muted); }
.risk-rank-row.is-empty .risk-rank-no { background: #eef3f3; color: var(--muted); }
.risk-rank-row.is-empty .risk-rank-name,
.risk-rank-row.is-empty .risk-rank-amount,
.risk-rank-row.is-empty .risk-rank-code { color: var(--muted); }
.risk-rank-no { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 999px; background: #e9f6ef; color: var(--brand); font-size: 12px; font-weight: 800; }
.risk-rank-code, .risk-rank-name, .risk-rank-amount { min-width: 0; font-size: 12px; line-height: 1.35; overflow-wrap: anywhere; }
.risk-rank-name { font-weight: 800; }
.risk-rank-amount { color: var(--muted-strong); font-weight: 800; }
.risk-rank-level { justify-self: start; min-width: 38px; }
@media (max-width: 1400px) {
  .risk-center-hero { grid-template-columns: minmax(0,1fr) 360px; }
  .risk-kpi-board { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 1180px) {
  .risk-center-layout, .risk-center-hero { grid-template-columns: 1fr; }
  .risk-list-panel, .risk-detail-panel, .risk-advice-panel, .risk-trend-panel, .risk-matrix-panel, .risk-ranking-panel { grid-column: 1 / -1; grid-row: auto; min-height: 0; }
}
@media (max-width: 760px) {
  .risk-meta-grid, .risk-kpi-board, .risk-detail-main, .risk-evidence-chain { grid-template-columns: 1fr; }
  .risk-decision-card { grid-template-columns: 1fr; }
  .risk-decision-card p { grid-column: 1; }
  .risk-filter-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .risk-matrix { grid-template-columns: 1fr; }
  .risk-matrix-y-title { grid-column: 1; grid-row: auto; writing-mode: horizontal-tb; transform: none; text-align: center; }
  .risk-matrix-likelihood-labels, .risk-matrix-grid, .risk-matrix-impact-labels, .risk-matrix-x-title { grid-column: 1; }
  .risk-rank-header { display: none; }
  .risk-rank-row { grid-template-columns: 32px 1fr; }
  .risk-rank-code, .risk-rank-amount, .risk-rank-level { grid-column: 2; }
}

/* Risk warning center header refinement */
.risk-center-hero {
  grid-template-columns: minmax(0,1fr) 380px !important;
  gap: 10px !important;
}
.risk-decision-card {
  min-height: 104px;
  padding: 13px 15px !important;
}
.risk-decision-card p {
  max-width: 1120px;
}
.risk-control-card {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(20,60,63,.04);
}
.risk-period-field, .risk-meta-pill {
  display: grid;
  align-content: center;
  gap: 5px;
  min-height: 58px;
  padding: 9px 10px;
  border: 1px solid #d9e4e6;
  border-radius: 8px;
  background: #f8fbfb;
}
.risk-meta-pill.wide { grid-column: 1 / -1; }
.risk-period-field span, .risk-meta-pill span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.risk-meta-pill strong {
  color: #173f46;
  font-size: 13px;
  line-height: 1.35;
}
.risk-period-field select {
  width: 100%;
  height: 30px;
  border: 0;
  border-radius: 6px;
  background: #e9f6ef;
  color: var(--brand);
  font-size: 13px;
  font-weight: 800;
  outline: 1px solid transparent;
}
.risk-period-field select:focus { outline-color: var(--brand); }
@media (max-width: 1180px) {
  .risk-center-hero { grid-template-columns: 1fr !important; }
  .risk-control-card { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .risk-meta-pill.wide { grid-column: auto; }
}
@media (max-width: 760px) {
  .risk-control-card { grid-template-columns: 1fr; }
  .risk-meta-pill.wide { grid-column: 1; }
}

/* Risk warning center workbench-style header */
.risk-filter-strip {
  margin-top: 0;
}
.risk-summary-band {
  margin-top: 0;
}
.risk-summary-band .decision-card {
  min-height: 94px;
}
.risk-filter-strip .filter-meta {
  margin-left: auto;
}
@media (max-width: 680px) {
  .risk-filter-strip .filter-meta { margin-left: 0; }
}

/* Risk center dashboard-only refinement */
.risk-advice-panel .mini-badge { background: #eef7f8; color: var(--brand-2); }
.risk-disposal-card {
  display: flex;
  flex-direction: column;
  gap: 13px;
  height: 100%;
  padding: 14px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand-2);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(20,60,63,.04);
}
.risk-disposal-card.high { border-left-color: var(--red); }
.risk-disposal-card.medium { border-left-color: var(--amber); }
.risk-disposal-card.low { border-left-color: var(--green); }
.risk-disposal-card.is-empty { border-left-color: #c7d8d5; background: #f8fbfa; }
.risk-advice-meta { display: grid; gap: 9px; }
.risk-advice-meta div {
  display: grid;
  grid-template-columns: 72px minmax(0,1fr);
  gap: 10px;
  align-items: start;
}
.risk-advice-meta span,
.risk-advice-action-block > span,
.risk-case-strip span { color: var(--muted); font-size: 12px; font-weight: 700; }
.risk-advice-meta strong { color: var(--text); font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.risk-advice-action-block {
  padding-top: 2px;
  border-top: 1px dashed #d8e6df;
}
.risk-advice-action-block ol {
  display: grid;
  gap: 7px;
  max-height: 193px;
  margin: 8px 0 0;
  padding: 0 6px 0 18px;
  color: var(--text);
  font-size: 12px;
  line-height: 1.5;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-gutter: stable;
}
.risk-advice-action-block li { min-height: 43px; padding-right: 4px; }
.risk-advice-action-block li::marker { color: var(--brand); font-weight: 800; }
.risk-advice-footer-actions {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px dashed #d8e6df;
}
.risk-advice-footer-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 0;
  min-height: 36px;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}
.risk-advice-footer-actions svg { width: 15px; height: 15px; }
.risk-close-warning { border: 1px solid #f0c7c2; background: #fff7f6; color: var(--red); }
.risk-close-warning:hover { border-color: var(--red); background: #fff1ef; }
.risk-close-warning:disabled { border-color: #d8e6df; background: #f6f8f8; color: var(--muted); cursor: not-allowed; }
.risk-node-link { border: 1px solid #b9d8d4; background: #f4fbfa; color: var(--brand); }
.risk-node-link:hover { border-color: var(--brand); background: #e9f6ef; }
.risk-case-strip {
  display: grid;
  grid-template-columns: 68px minmax(0,1fr);
  gap: 8px 12px;
  align-items: start;
  padding-top: 10px;
  border-top: 1px dashed #d8e6df;
}
.risk-case-strip strong { color: var(--text); font-size: 12px; line-height: 1.35; }
.risk-case-strip em {
  grid-column: 2;
  color: var(--brand);
  font-size: 12px;
  font-style: normal;
  line-height: 1.4;
}
.risk-case-detail-link {
  grid-column: 2;
  justify-self: start;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--brand);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}
.risk-case-detail-link:hover { text-decoration: underline; }
.risk-case-detail-link:disabled { color: var(--muted); cursor: default; text-decoration: none; }
.risk-case-brief { display: grid; gap: 12px; }
.risk-case-title {
  padding: 12px;
  border: 1px solid #d8e6df;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #f7faf8;
}
.risk-case-title span { color: var(--muted); font-size: 12px; font-weight: 800; }
.risk-case-title h3 { margin: 4px 0 0; font-size: 17px; }
.risk-case-title p { display: block !important; margin: 8px 0 0; color: var(--muted-strong); font-size: 13px; line-height: 1.55; }
.risk-case-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.risk-case-grid div,
.risk-case-compare div,
.risk-case-actions {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}
.risk-case-grid span,
.risk-case-compare span { display: block; color: var(--muted); font-size: 12px; font-weight: 700; }
.risk-case-grid strong,
.risk-case-compare strong { display: block; margin-top: 5px; color: var(--text); font-size: 13px; line-height: 1.4; }
.risk-case-compare { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.risk-case-actions { margin: 0; padding-left: 28px; color: var(--text); font-size: 13px; line-height: 1.65; }
.risk-case-actions li::marker { color: var(--brand); font-weight: 800; }
@media (max-width: 760px) {
  .risk-case-grid,
  .risk-case-compare { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .risk-advice-meta div,
  .risk-case-strip { grid-template-columns: 1fr; }
  .risk-case-strip em,
  .risk-case-detail-link { grid-column: 1; }
}


/* Compact comparison header and independent document reading */
.compare-view .compare-hero {
  grid-template-columns: minmax(0,1fr) minmax(520px,640px);
  gap: 10px;
  padding: 10px 12px;
  align-items: center;
}
.compare-view .compare-hero-insights {
  gap: 6px;
  margin-top: 8px;
}
.compare-view .compare-hero-insights div {
  min-height: 52px;
  padding: 8px 10px;
}
.compare-view .compare-hero-insights strong {
  margin-top: 3px;
  font-size: 12.5px;
  line-height: 1.28;
}
.compare-view .compare-score-card.compare-stage-card {
  display: grid;
  grid-template-columns: auto minmax(74px,.8fr) repeat(3,minmax(0,1fr));
  gap: 8px;
  align-items: center;
  align-content: center;
  padding: 10px;
}
.compare-view .compare-stage-card > span,
.compare-view .compare-score-card > strong.compare-stage-value {
  margin: 0;
  white-space: nowrap;
}
.compare-view .compare-score-card > strong.compare-stage-value {
  color: var(--brand);
  font-size: 15px;
  line-height: 1.2;
}
.compare-view .compare-stage-note {
  display: none;
}
.compare-view .compare-stage-card .compare-action-row {
  display: contents;
}
.compare-view .compare-stage-card .compact-tool {
  min-height: 34px;
  padding: 7px 10px;
  justify-content: center;
}
.compare-view .compare-setup-panel,
.compare-view .compare-summary-panel {
  height: clamp(430px, 42vh, 500px);
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.compare-view .compare-setup-panel { grid-column: span 5; }
.compare-view .compare-summary-panel { grid-column: span 7; }
.compare-view .compare-upload-deck {
  flex: 0 0 auto;
  overflow: visible;
}
.compare-view .compare-version-grid,
.compare-view .compare-summary {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}
.compare-view .compare-action-bar {
  flex: 0 0 auto;
}
.compare-view .compare-doc-body {
  overscroll-behavior: contain;
}
@media (max-width: 1320px) {
  .compare-view .compare-hero {
    grid-template-columns: 1fr;
  }
  .compare-view .compare-score-card.compare-stage-card {
    grid-template-columns: auto minmax(120px,1fr) repeat(3,minmax(0,1fr));
  }
}
@media (max-width: 1180px) {
  .compare-view .compare-setup-panel,
  .compare-view .compare-summary-panel {
    grid-column: 1 / -1;
    height: auto;
    overflow: visible;
  }
  .compare-view .compare-version-grid,
  .compare-view .compare-summary {
    max-height: none;
    overflow: visible;
  }
}
@media (max-width: 760px) {
  .compare-view .compare-score-card.compare-stage-card {
    grid-template-columns: 1fr 1fr;
  }
  .compare-view .compare-stage-card .compare-action-row {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
  }
}


.compare-upload-grid.is-loaded .compare-upload-slot,
.compare-upload-slot.is-linked,
.compare-upload-slot.is-ready {
  opacity: 1;
}
.compare-upload-grid.is-loaded .compare-upload-main,
.compare-upload-slot.is-linked .compare-upload-main,
.compare-upload-slot.is-ready .compare-upload-main {
  border-style: solid;
  border-color: #b8d7d3;
  background: #f4fbfa;
  cursor: default;
}
.compare-upload-grid.is-loaded .compare-upload-main i,
.compare-upload-slot.is-linked .compare-upload-main i,
.compare-upload-slot.is-ready .compare-upload-main i {
  color: var(--brand);
}


/* Comparison header alignment and compact version-name rows */
.compare-view .compare-hero {
  grid-template-columns: minmax(0,1fr) minmax(560px,660px);
  align-items: stretch;
}
.compare-view .compare-hero > div:first-child {
  display: flex;
  min-width: 0;
}
.compare-view .compare-hero-insights {
  flex: 1 1 auto;
  align-items: stretch;
  margin-top: 0;
}
.compare-view .compare-hero-insights div {
  display: grid;
  align-content: center;
  min-height: 44px;
  padding: 8px 10px;
}
.compare-view .compare-score-card.compare-stage-card {
  grid-template-columns: minmax(154px,.95fr) repeat(3,minmax(108px,1fr));
  gap: 8px;
  align-items: stretch;
  padding: 0;
  border: 0;
  background: transparent;
}
.compare-view .compare-stage-status,
.compare-view .compare-stage-card .compact-tool {
  min-height: 44px;
  height: 100%;
  border-radius: 8px;
}
.compare-view .compare-stage-status {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid #d8e5e8;
  background: rgba(255,255,255,.92);
}
.compare-view .compare-stage-status span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.compare-view .compare-stage-status strong.compare-stage-value {
  margin: 0;
  color: var(--brand);
  font-size: 15px;
  line-height: 1.2;
  white-space: nowrap;
}
.compare-view .compare-upload-deck {
  gap: 6px;
  padding-top: 10px;
}
.compare-view .compare-upload-head {
  min-height: 38px;
  padding: 8px 10px;
}
.compare-view .compare-upload-head span {
  margin-top: 1px;
  font-size: 11.5px;
  line-height: 1.25;
}
.compare-view .compare-upload-grid {
  gap: 6px;
}
.compare-view .compare-upload-main {
  display: flex;
  grid-template-columns: none;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 7px 9px;
}
.compare-view .compare-upload-main i {
  flex: 0 0 auto;
  grid-row: auto;
  align-self: center;
  width: 17px;
  height: 17px;
}
.compare-view .compare-upload-main span {
  flex: 0 0 auto;
  padding: 2px 6px;
  border-radius: 999px;
  background: #eef7f8;
  color: var(--brand);
  font-size: 10.5px;
  line-height: 1.2;
  white-space: nowrap;
}
.compare-view .compare-upload-main strong {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  line-height: 1.2;
}
.compare-view .compare-upload-main em,
.compare-view .compare-upload-main small {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10.5px;
  line-height: 1.2;
}
.compare-view .compare-upload-main em {
  max-width: 190px;
  color: var(--muted-strong);
}
.compare-view .compare-upload-main small {
  grid-column: auto;
  max-width: 180px;
  color: var(--brand);
  font-weight: 700;
}
@media (max-width: 1320px) {
  .compare-view .compare-hero {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .compare-view .compare-score-card.compare-stage-card,
  .compare-view .compare-upload-grid {
    grid-template-columns: 1fr;
  }
  .compare-view .compare-upload-main {
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .compare-view .compare-upload-main strong {
    flex-basis: calc(100% - 86px);
  }
  .compare-view .compare-upload-main em,
  .compare-view .compare-upload-main small {
    max-width: 100%;
  }
}


/* Compact electronic signature header alignment */
.sign-view .sign-hero {
  grid-template-columns: minmax(0,1fr) minmax(420px,520px);
  gap: 10px;
  padding: 10px 12px;
  align-items: stretch;
}
.sign-view .sign-hero-copy {
  display: flex;
  min-width: 0;
  align-content: stretch;
}
.sign-view .sign-hero-insights {
  flex: 1 1 auto;
  align-items: stretch;
  margin: 0;
}
.sign-view .sign-hero-insights div {
  display: grid;
  align-content: center;
  min-height: 44px;
  padding: 8px 10px;
  border-left: 3px solid transparent;
}
.sign-view .sign-hero-insights strong {
  margin-top: 3px;
  font-size: 12.5px;
  line-height: 1.28;
}
.sign-view .sign-score-card.sign-progress-card {
  display: grid;
  grid-template-columns: minmax(150px,.9fr) minmax(160px,1fr);
  gap: 8px;
  align-items: stretch;
  align-content: stretch;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.sign-view .sign-stage-status,
.sign-view .sign-action-row .compact-tool {
  min-height: 44px;
  height: 100%;
  border-radius: 8px;
}
.sign-view .sign-stage-status {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid #d8e6df;
  background: rgba(255,255,255,.92);
}
.sign-view .sign-stage-status span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.sign-view .sign-stage-status strong {
  margin: 0;
  color: var(--brand);
  font-size: 15px;
  line-height: 1.2;
  white-space: nowrap;
}
.sign-view .sign-progress-card > p {
  display: none !important;
}
.sign-view .sign-action-row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: stretch;
  gap: 8px;
}
.sign-view .sign-action-row .compact-tool {
  width: 100%;
  justify-content: center;
  padding: 7px 10px;
}
.sign-view .sign-permission-hint {
  grid-column: 1 / -1;
  min-height: 34px;
  padding: 7px 10px;
  align-self: stretch;
}
.sign-view .sign-permission-hint:empty,
.sign-view .sign-permission-hint[hidden] {
  display: none;
}
.sign-view .sign-hero-insights .sign-status-done,
.sign-view .sign-hero-insights .sign-approval-approved {
  border-left-color: #2f7d4f;
  background: #f4fbf7;
}
.sign-view .sign-hero-insights .sign-status-active,
.sign-view .sign-hero-insights .sign-approval-pending,
.sign-view .sign-hero-insights .sign-seal-business,
.sign-view .sign-hero-insights .sign-seal-paging {
  border-left-color: #c8932c;
  background: #fffaf0;
}
.sign-view .sign-hero-insights .sign-status-pending,
.sign-view .sign-hero-insights .sign-approval-neutral,
.sign-view .sign-hero-insights .sign-seal-pending,
.sign-view .sign-hero-insights .sign-seal-neutral {
  border-left-color: #7e96a3;
  background: #f7faf8;
}
.sign-view .sign-hero-insights .sign-approval-rejected {
  border-left-color: #b65c5c;
  background: #fff6f6;
}
.sign-view .sign-hero-insights .sign-seal-contract,
.sign-view .sign-hero-insights .sign-seal-enterprise,
.sign-view .sign-hero-insights .sign-seal-legal {
  border-left-color: var(--brand-2);
  background: #f4f9fb;
}
@media (max-width: 1320px) {
  .sign-view .sign-hero {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .sign-view .sign-score-card.sign-progress-card {
    grid-template-columns: 1fr;
  }
  .sign-view .sign-action-row {
    flex-wrap: wrap;
  }
}


/* Electronic signature compact flow history */
.sign-view .sign-permission-hint {
  display: none !important;
}
.sign-view .sign-role-layout {
  align-items: stretch;
}
.sign-view .sign-operation-panel,
.sign-view .sign-check-panel,
.sign-view .sign-log-panel {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.sign-view .sign-operation-panel > .panel-header,
.sign-view .sign-check-panel > .panel-header,
.sign-view .sign-log-panel > .panel-header {
  flex: 0 0 auto;
}
.sign-view .sign-prep-card,
.sign-view .sign-checklist,
.sign-view .sign-process-chain,
.sign-view .sign-log-list,
.sign-view .sign-history-section {
  flex: 0 0 auto;
}
.sign-view .signature-party-stack {
  flex: 1 1 auto;
  display: grid;
  grid-template-rows: repeat(2, minmax(210px, 1fr));
}
.sign-view .signature-party-box,
.sign-view .signature-party-card {
  min-height: 0;
  height: 100%;
}
.sign-view .signature-party-card {
  align-content: stretch;
}
.sign-view .sign-checklist,
.sign-view .sign-log-list {
  flex: 1 1 auto;
  align-content: start;
}
.sign-view .sign-history-section {
  margin-top: auto;
}
.sign-process-chain {
  gap: 8px;
  padding: 0 12px 12px;
}
.sign-flow-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: 2px;
}
.sign-flow-head h4 {
  margin: 0;
  color: #12343d;
  font-size: 13px;
}
.sign-flow-head .text-button {
  white-space: nowrap;
  font-size: 12px;
}
.sign-current-flow {
  padding: 8px 10px;
  border: 1px solid #d8e6df;
  border-radius: 8px;
  background: #f7faf8;
}
.sign-current-flow .sign-chain-node {
  min-height: 44px;
  padding: 0;
}
.sign-current-flow .sign-chain-node::after {
  display: none;
}
.sign-flow-full-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  padding: 10px;
  border: 1px solid #e1ecec;
  border-radius: 8px;
  background: #fff;
}
.sign-flow-full-list .sign-chain-node {
  width: 100%;
  box-sizing: border-box;
  min-height: 62px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid #d8e6df;
  border-radius: 8px;
  background: #fbfcfc;
}
.sign-flow-full-list .sign-chain-node.is-done {
  border-color: #b7d8c5;
  background: #f4fbf7;
}
.sign-flow-full-list .sign-chain-node.is-active {
  border-color: #e2c36f;
  background: #fffaf0;
}
.sign-flow-full-list .sign-chain-node.is-locked {
  border-color: #dde6ea;
  background: #f8fafb;
}
.sign-flow-full-list .sign-chain-node::after {
  display: none;
}
.sign-chain-node.is-compact {
  grid-template-columns: 24px minmax(0,1fr);
  gap: 7px;
}
.sign-chain-node.is-compact .chain-dot {
  width: 20px;
  height: 20px;
  font-size: 10px;
}
.sign-chain-node.is-compact strong {
  font-size: 12px;
}
.sign-chain-node.is-compact em {
  margin-top: 2px;
  font-size: 11px;
  line-height: 1.3;
}
.sign-flow-full-list .sign-chain-node.is-compact {
  grid-template-columns: 30px minmax(0,1fr);
  gap: 9px;
}
.sign-flow-full-list .sign-chain-node.is-compact .chain-dot {
  width: 24px;
  height: 24px;
  font-size: 11px;
}
.sign-flow-full-list .sign-chain-node.is-compact strong {
  font-size: 13px;
}
.sign-flow-full-list .sign-chain-node.is-compact em {
  margin-top: 3px;
  font-size: 12px;
  line-height: 1.35;
}
.preview-modal-body.sign-flow-preview {
  width: min(760px, calc(100% - 36px));
  padding: 22px;
}
.sign-flow-preview-head {
  display: grid;
  gap: 5px;
  margin-bottom: 14px;
  padding: 12px;
  border: 1px solid #d8e6df;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #f7faf8;
}
.sign-flow-preview-head span,
.sign-flow-preview-head em {
  color: var(--muted-strong);
  font-size: 12px;
  font-style: normal;
}
.sign-flow-preview-head strong {
  color: var(--brand);
  font-size: 20px;
}
.sign-flow-preview-list {
  display: grid;
  gap: 8px;
}
.sign-flow-preview-list .sign-chain-node {
  min-height: 58px;
  padding: 8px 0;
}
.preview-modal-body.sign-log-preview {
  width: min(760px, calc(100% - 36px));
  padding: 22px;
}
.sign-log-preview-list {
  display: grid;
  gap: 8px;
  max-height: min(62vh, 620px);
  overflow-y: auto;
  padding-right: 4px;
}
@media (max-width: 760px) {
  .preview-modal-body.sign-flow-preview,
  .preview-modal-body.sign-log-preview {
    width: calc(100% - 20px);
    padding: 16px;
  }
}
@media (max-width: 1180px) {
  .sign-view .signature-party-stack {
    grid-template-rows: none;
  }
}

/* Customer 360 dashboard */
.customer360-view.is-active { display: grid; gap: 12px; }
.customer-filter-strip {
  grid-template-columns: minmax(260px,1.35fr) repeat(4,minmax(128px,.65fr)) minmax(300px,1fr) max-content;
  align-items: end;
}
.customer-search-field {
  position: relative;
  display: grid;
  gap: 5px;
  min-width: 0;
}
.customer-search-field > span { color: var(--muted); font-size: 12px; font-weight: 700; }
.customer-search-field label {
  display: grid;
  grid-template-columns: 18px minmax(0,1fr);
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.customer-search-field input { min-width: 0; border: 0; outline: 0; color: var(--text); font: inherit; }
.customer-search-results {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 44px rgba(20,60,63,.15);
}
.customer-search-results button {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 3px 10px;
  padding: 9px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: #fff;
  color: var(--text);
  text-align: left;
}
.customer-search-results button:hover { border-color: var(--brand); background: #f4fbfa; }
.customer-search-results span { grid-column: 1; color: var(--muted); font-size: 12px; }
.customer-search-results em { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
.customer-kpi-board {
  display: grid;
  grid-template-columns: repeat(6,minmax(145px,1fr));
  gap: 10px;
}
.customer-kpi-card {
  display: grid;
  grid-template-columns: 32px minmax(0,1fr);
  gap: 8px;
  min-height: 104px;
  padding: 10px;
  border: 1px solid var(--line);
  border-top: 3px solid var(--brand-2);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(20,60,63,.05);
}
.customer-kpi-card.red, .customer-kpi-card.high { border-top-color: var(--red); }
.customer-kpi-card.amber, .customer-kpi-card.medium { border-top-color: var(--amber); }
.customer-kpi-card.green, .customer-kpi-card.low { border-top-color: var(--green); }
.customer-kpi-card.teal { border-top-color: var(--brand); }
.customer-kpi-card.cert { border-top-color: #2676a9; }
.customer-kpi-card span, .customer-kpi-card strong, .customer-kpi-card em { display: block; min-width: 0; }
.customer-kpi-card div > span { color: var(--muted); font-size: 12px; }
.customer-kpi-card strong { margin-top: 4px; color: var(--text); font-size: 17px; line-height: 1.18; overflow-wrap: anywhere; }
.customer-kpi-card em { margin-top: 4px; color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.28; }
.customer360-layout {
  display: grid;
  grid-template-columns: repeat(12,minmax(0,1fr));
  gap: 12px;
  align-items: stretch;
  grid-auto-flow: dense;
}
.customer360-layout > .panel { min-height: 0; animation: customerPanelIn .18s ease both; }
@keyframes customerPanelIn { from { opacity: .72; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
.customer-risk-panel { grid-column: 1 / span 4; }
.customer-rank-panel { grid-column: 5 / span 5; }
.customer-list-panel { grid-column: 10 / span 3; }
.customer-warning-panel { grid-column: 1 / span 4; }
.customer-score-panel { grid-column: 5 / span 4; }
.customer-preview-panel { grid-column: 9 / span 4; }
.customer360-layout.is-selected .customer-file-panel { grid-column: 1 / span 3; }
.customer360-layout.is-selected .customer-risk-portrait-panel { grid-column: 4 / span 5; }
.customer360-layout.is-selected .customer-relation-panel { grid-column: 9 / span 4; }
.customer360-layout.is-selected .customer-history-panel { grid-column: 1 / span 4; }
.customer360-layout.is-selected .customer-eval-panel { grid-column: 5 / span 4; }
.customer360-layout.is-selected .customer-cert-auth-panel { grid-column: 9 / span 4; }
.customer-risk-bars, .customer-score-bars, .customer-warning-list, .customer-history-list, .customer-preview-table, .customer-rank-list, .customer-ai-list-suggest, .customer-file-scroll, .customer-risk-list {
  display: grid;
  gap: 8px;
  padding: 12px 14px 14px;
}
.customer-risk-bars div, .customer-score-bars div {
  display: grid;
  grid-template-columns: 66px minmax(0,1fr) 42px;
  align-items: center;
  gap: 9px;
  min-height: 30px;
}
.customer-risk-bars span, .customer-score-bars span { color: var(--muted); font-size: 12px; font-weight: 700; }
.customer-risk-bars strong, .customer-score-bars strong { color: var(--text); font-size: 12px; }
.bar-fill.high { background: var(--red); }
.bar-fill.medium { background: var(--amber); }
.bar-fill.low { background: var(--green); }
.customer-tag-cloud, .customer-pill-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding: 0 14px 14px;
}
.customer-tag-cloud span, .customer-pill-list span {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 9px;
  border: 1px solid #d7e5e1;
  border-radius: 999px;
  background: #f7faf8;
  color: #31575c;
  font-size: 12px;
  font-weight: 700;
}
.customer-rank-row, .customer-warning-list button, .customer-history-list button, .customer-preview-table button, .customer-ai-list-suggest button {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand-2);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
}
.customer-rank-row { display: grid; grid-template-columns: 24px minmax(0,1fr) 50px 74px 54px; align-items: center; gap: 8px; min-height: 46px; padding: 8px 10px; }
.customer-rank-row.high, .customer-warning-list button.high { border-left-color: var(--red); }
.customer-rank-row.medium { border-left-color: var(--amber); }
.customer-rank-row.low { border-left-color: var(--green); }
.customer-rank-row:hover, .customer-warning-list button:hover, .customer-history-list button:hover, .customer-preview-table button:hover, .customer-ai-list-suggest button:hover { border-color: var(--brand); background: #f4fbfa; }
.customer-rank-row b { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 999px; background: #e9f6ef; color: var(--brand); font-size: 12px; }
.customer-rank-row strong, .customer-preview-table strong, .customer-history-list strong, .customer-ai-list-suggest strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.customer-rank-row span, .customer-rank-row em, .customer-rank-row i, .customer-preview-table span, .customer-preview-table em, .customer-history-list span, .customer-history-list em, .customer-history-list i, .customer-ai-list-suggest span, .customer-ai-list-suggest em { color: var(--muted-strong); font-size: 12px; font-style: normal; }
.customer-list-status-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
  padding: 12px 14px 4px;
}
.customer-list-status-grid button {
  display: grid;
  gap: 4px;
  min-height: 68px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfb;
  color: var(--text);
  text-align: left;
}
.customer-list-status-grid strong { color: var(--brand); font-size: 20px; }
.customer-list-status-grid span { color: var(--muted); font-size: 12px; }
.customer-ai-list-suggest { max-height: 252px; overflow-y: auto; }
.customer-ai-list-suggest button, .customer-warning-list button, .customer-history-list button {
  display: grid;
  gap: 4px;
  min-height: 62px;
  padding: 10px;
}
.customer-preview-table { max-height: 336px; overflow-y: auto; }
.customer-preview-table button {
  display: grid;
  grid-template-columns: minmax(0,1.2fr) 54px 64px 76px 62px;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 8px 10px;
}
.customer-file-scroll {
  max-height: 392px;
  overflow-y: auto;
  scrollbar-gutter: stable;
}
.customer-file-scroll div {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.customer-file-scroll span { color: var(--muted); font-size: 12px; }
.customer-file-scroll strong { color: var(--text); font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
.customer-relation-axis {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 10px;
  padding: 18px 14px 14px;
}
.customer-relation-axis::before { content: ""; position: absolute; left: 52px; right: 52px; top: 34px; height: 1px; background: #c9dadd; }
.customer-relation-axis div { position: relative; z-index: 1; display: grid; justify-items: center; gap: 5px; min-height: 118px; text-align: center; }
.customer-relation-axis span { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid #c9dadd; border-radius: 999px; background: #f3f8f8; color: var(--brand); font-weight: 900; box-shadow: 0 0 0 4px #fff; }
.customer-relation-axis strong { font-size: 13px; }
.customer-relation-axis b { color: var(--brand); font-size: 12px; line-height: 1.35; }
.customer-relation-axis em { color: var(--muted); font-size: 11.5px; font-style: normal; line-height: 1.35; }
.customer-eval-text, .customer-risk-summary { display: block !important; margin: 0 14px 14px; color: var(--muted-strong); font-size: 13px; line-height: 1.5; }
.customer-status-line { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 14px 0; }
.customer-risk-list { grid-template-columns: repeat(3,minmax(0,1fr)); }
.customer-risk-list div { display: grid; grid-template-columns: 22px minmax(0,1fr); gap: 8px; min-height: 58px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.customer-risk-list b { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 999px; background: #e9f6ef; color: var(--brand); font-size: 11px; }
.customer-risk-list span { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.customer360-layout.is-selected .customer-risk-portrait-panel {
  border-top: 3px solid var(--brand);
}
.customer-risk-portrait-core {
  display: grid;
  gap: 10px;
  padding: 12px 14px 14px;
}
.customer-risk-overview {
  display: grid;
  grid-template-columns: 116px minmax(0,1fr);
  gap: 12px;
  align-items: center;
}
.customer-risk-score-ring {
  position: relative;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 3px;
  width: 104px;
  height: 104px;
  border-radius: 999px;
  background: conic-gradient(var(--risk-color) var(--risk-score), #e7eef0 0);
  color: #123b42;
  justify-self: center;
}
.customer-risk-score-ring::after {
  content: "";
  position: absolute;
  inset: 11px;
  border-radius: inherit;
  background: #fff;
  box-shadow: inset 0 0 0 1px #dce8e6;
}
.customer-risk-score-ring strong,
.customer-risk-score-ring span {
  position: relative;
  z-index: 1;
  line-height: 1.05;
}
.customer-risk-score-ring strong { font-size: 28px; color: #123b42; }
.customer-risk-score-ring span { color: var(--muted); font-size: 11px; font-weight: 800; }
.customer-risk-brief {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.customer-risk-portrait-panel .customer-status-line,
.customer-risk-portrait-panel .customer-tag-cloud {
  padding: 0;
}
.customer-risk-driver-mini {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px 10px;
}
.customer-risk-driver-mini div {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) 32px;
  align-items: center;
  gap: 8px;
  min-height: 28px;
  padding: 6px 8px;
  border: 1px solid #dce8e6;
  border-radius: 8px;
  background: #fbfdfc;
}
.customer-risk-driver-mini span,
.customer-risk-driver-mini strong {
  color: var(--muted-strong);
  font-size: 12px;
  font-weight: 800;
}
.customer-risk-driver-mini i {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #e9edf2;
}
.customer-risk-driver-mini b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--brand);
}
.customer-risk-driver-mini .high b { background: var(--red); }
.customer-risk-driver-mini .medium b { background: var(--amber); }
.customer-risk-driver-mini .low b { background: var(--green); }
.customer-risk-card-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
}
.customer-risk-card-grid article {
  display: grid;
  gap: 7px;
  min-height: 76px;
  padding: 10px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand-2);
  border-radius: 8px;
  background: #fff;
}
.customer-risk-card-grid article.high { border-left-color: var(--red); background: #fffafa; }
.customer-risk-card-grid article.medium { border-left-color: var(--amber); background: #fffdf7; }
.customer-risk-card-grid article.low { border-left-color: var(--green); background: #fbfefd; }
.customer-risk-card-grid article div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.customer-risk-card-grid strong { color: var(--text); font-size: 13px; }
.customer-risk-card-grid p {
  margin: 0;
  color: var(--muted-strong);
  font-size: 12px;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.customer-cert-auth-board {
  display: grid;
  gap: 10px;
  padding: 12px 14px 14px;
}
.customer-cert-auth-board div {
  display: grid;
  gap: 7px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.customer-cert-auth-board span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.customer-cert-auth-board p {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
}
.customer-cert-auth-board em {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid #d7e5e1;
  border-radius: 999px;
  background: #f7faf8;
  color: #31575c;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.customer-risk, .customer-list-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}
.customer-risk.high { background: #fff1ef; color: var(--red); }
.customer-risk.medium { background: #fff7e3; color: var(--amber); }
.customer-risk.low { background: #e9f6ef; color: var(--green); }
.customer-list-badge.white { background: #e9f6ef; color: var(--green); }
.customer-list-badge.focus { background: #fff7e3; color: var(--amber); }
.customer-list-badge.black { background: #fff1ef; color: var(--red); }
.customer-list-badge.normal { background: #eef2f6; color: var(--slate); }
.customer-empty { padding: 18px; border: 1px dashed #cbdad7; border-radius: 8px; background: #f8fbfa; color: var(--muted); font-size: 13px; }
@media (max-width: 1420px) {
  .customer-filter-strip { grid-template-columns: minmax(260px,1.4fr) repeat(3,minmax(122px,.6fr)) minmax(260px,1fr); }
  .customer-filter-strip .filter-meta { grid-column: auto; }
  .customer-kpi-board { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 1180px) {
  .customer-filter-strip, .customer360-layout, .customer360-layout.is-selected { grid-template-columns: 1fr; }
  .customer360-layout > .panel, .customer360-layout.is-selected > .panel { grid-column: 1 / -1; grid-row: auto; }
  .customer-relation-axis, .customer-risk-list { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .customer-kpi-board { grid-template-columns: 1fr; }
  .customer-preview-table button, .customer-rank-row { grid-template-columns: 1fr; }
}

/* Customer 360 redesign overrides */
.customer-filter-strip {
  display: grid !important;
  grid-template-columns: minmax(360px,1fr) 150px minmax(330px,auto) max-content !important;
  align-items: end;
  gap: 10px;
}
.customer-search-results[hidden] { display: none !important; }
.customer-search-field label { min-height: 38px; background: #fff; }
.customer-date-range { min-width: 320px; }
.customer-update-meta { min-width: 160px; }
.customer-risk-panel { grid-column: 1 / span 5; }
.customer-rank-panel { grid-column: 6 / span 4; }
.customer-list-panel { grid-column: 10 / span 3; }
.customer-warning-panel { grid-column: 1 / span 4; }
.customer-score-panel { grid-column: 5 / span 4; }
.customer-preview-panel { grid-column: 9 / span 4; }
.customer-risk-dashboard { display: grid; gap: 10px; padding: 12px 14px 14px; }
.customer-risk-snapshot {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 8px;
}
.customer-risk-snapshot div {
  display: grid;
  gap: 4px;
  min-height: 74px;
  padding: 10px;
  border: 1px solid #d7e5e1;
  border-radius: 8px;
  background: linear-gradient(180deg,#fff,#f8fbfa);
}
.customer-risk-snapshot span, .customer-risk-snapshot em { color: var(--muted); font-size: 12px; font-style: normal; }
.customer-risk-snapshot strong { color: #0b4f4a; font-size: 22px; line-height: 1.1; }
.customer-risk-stack {
  display: flex;
  overflow: hidden;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.customer-risk-stack span {
  display: grid;
  align-content: center;
  justify-items: center;
  min-width: 64px;
  color: #fff;
  text-align: center;
}
.customer-risk-stack span.high { background: #b3261e; }
.customer-risk-stack span.medium { background: #b88422; }
.customer-risk-stack span.low { background: #17855b; }
.customer-risk-stack b { font-size: 12px; }
.customer-risk-stack em { font-size: 11px; font-style: normal; opacity: .95; }
.customer-analysis-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1.15fr;
  gap: 8px;
}
.customer-mini-chart, .customer-risk-matrix-mini {
  display: grid;
  gap: 8px;
  min-height: 148px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.customer-mini-chart h4, .customer-risk-matrix-mini h4, .customer-ai-recommend h4 { margin: 0; color: #173f46; font-size: 13px; }
.customer-mini-chart p {
  display: grid;
  grid-template-columns: 72px minmax(0,1fr) 28px;
  align-items: center;
  gap: 7px;
  margin: 0;
}
.customer-mini-chart p span, .customer-mini-chart p strong { color: var(--muted-strong); font-size: 12px; }
.customer-mini-chart i {
  display: block;
  overflow: hidden;
  height: 8px;
  border-radius: 999px;
  background: #eef3f3;
}
.customer-mini-chart i b { display: block; height: 100%; border-radius: inherit; background: var(--brand); }
.customer-risk-matrix-mini > div {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 7px;
}
.customer-risk-matrix-mini span {
  display: grid;
  place-items: center;
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.45;
  text-align: center;
}
.customer-risk-matrix-mini span.high { background: #fff1ef; color: var(--red); border-color: #efc6bf; }
.customer-risk-matrix-mini span.medium { background: #fff7e3; color: var(--amber); border-color: #ead6a8; }
.customer-risk-matrix-mini span.low { background: #e9f6ef; color: var(--green); border-color: #c7e5d4; }
.customer-list-overview { display: grid; gap: 10px; padding: 12px 14px 14px; }
.customer-list-overview .customer-list-status-grid { padding: 0; }
.customer-month-focus {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 3px 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid #d7e5e1;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #f7faf8;
}
.customer-month-focus span { color: var(--muted); font-size: 12px; font-weight: 800; }
.customer-month-focus strong { color: var(--brand); font-size: 22px; }
.customer-month-focus em { grid-column: 1 / -1; color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.35; }

.customer-ai-recommend {
  display: grid;
  gap: 7px;
  max-height: 222px;
  overflow-y: auto;
  scrollbar-gutter: stable;
}
.customer-ai-recommend button {
  display: grid;
  gap: 4px;
  min-height: 64px;
  padding: 9px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--amber);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
}
.customer-ai-recommend button:hover { border-color: var(--brand); background: #f4fbfa; }
.customer-ai-recommend strong { font-size: 13px; }
.customer-ai-recommend span, .customer-ai-recommend em { color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.35; }
.customer360-layout.is-selected .customer-file-panel { grid-column: 1 / span 3; }
.customer360-layout.is-selected .customer-risk-portrait-panel { grid-column: 4 / span 5; }
.customer360-layout.is-selected .customer-relation-panel { grid-column: 9 / span 4; }
.customer360-layout.is-selected .customer-history-panel { grid-column: 1 / span 4; }
.customer360-layout.is-selected .customer-eval-panel { grid-column: 5 / span 4; }
.customer360-layout.is-selected .customer-cert-auth-panel { grid-column: 9 / span 4; }
.customer-relation-risk {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 4px 10px;
  margin: 12px 14px 0;
  padding: 10px;
  border: 1px solid #d7e5e1;
  border-radius: 8px;
  background: #f7faf8;
}
.customer-relation-risk span { color: var(--muted); font-size: 12px; font-weight: 800; }
.customer-relation-risk em { grid-column: 1 / -1; color: var(--muted-strong); font-size: 12px; font-style: normal; }
.customer-relation-axis { grid-template-columns: repeat(5,minmax(0,1fr)); padding-top: 18px; }
.customer-relation-axis::before { left: 46px; right: 46px; top: 34px; }
.customer-relation-axis div { min-height: 136px; }
@media (max-width: 1420px) {
  .customer-filter-strip { grid-template-columns: minmax(300px,1fr) 140px minmax(300px,auto) max-content !important; }
  .customer-analysis-grid { grid-template-columns: 1fr; }
}
@media (max-width: 1180px) {
  .customer-filter-strip { grid-template-columns: 1fr !important; }
  .customer-risk-snapshot, .customer-analysis-grid, .customer-relation-axis { grid-template-columns: 1fr; }
}

/* Customer 360 six-card dashboard refinement */
.brief-modal.is-wide { width: min(1180px, calc(100vw - 40px)); }
.customer-filter-strip {
  grid-template-columns: minmax(260px,1.05fr) minmax(220px,.82fr) 128px minmax(310px,auto) max-content !important;
}
.customer-picker-field select { min-width: 0; }
.customer360-layout:not(.is-selected) { grid-template-rows: minmax(420px,auto) minmax(390px,auto); }
.customer360-layout:not(.is-selected) > .panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.customer-preview-panel { grid-column: 1 / span 4; }
.customer-rank-panel { grid-column: 5 / span 4; }
.customer-list-panel { grid-column: 9 / span 4; }
.customer-risk-panel { grid-column: 1 / span 4; }
.customer-warning-panel { grid-column: 5 / span 4; }
.customer-score-panel { grid-column: 9 / span 4; }
.customer-preview-table,
.customer-rank-list,
.customer-list-overview,
.customer-risk-dashboard,
.customer-warning-list,
.customer-score-board {
  flex: 1 1 auto;
  min-height: 0;
}
.customer-preview-table,
.customer-rank-list,
.customer-warning-list {
  max-height: none;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-gutter: stable;
}
.customer-preview-table button {
  grid-template-columns: minmax(0,1.25fr) 58px 72px 76px 64px;
  min-height: 46px;
}
.customer-rank-list { padding-bottom: 12px; }
.customer-rank-row { min-height: 40px; padding-top: 7px; padding-bottom: 7px; }
.customer-list-overview {
  grid-template-rows: auto auto minmax(0,1fr);
  overflow: hidden;
}
.customer-ai-recommend {
  max-height: none;
  min-height: 0;
  overflow-y: auto;
  scrollbar-gutter: stable;
}
.customer-risk-dashboard { grid-template-rows: auto auto minmax(0,1fr); }
.customer-risk-pie-row {
  display: grid;
  grid-template-columns: minmax(148px,.82fr) minmax(0,1fr);
  gap: 10px;
  align-items: stretch;
}
.customer-risk-pie-card {
  display: grid;
  grid-template-columns: 96px minmax(0,1fr);
  align-items: center;
  gap: 10px;
  min-height: 132px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.customer-risk-pie {
  position: relative;
  display: grid;
  place-items: center;
  width: 92px;
  height: 92px;
  border-radius: 999px;
  background: var(--customer-risk-pie);
}
.customer-risk-pie::after {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: inherit;
  background: #fff;
  box-shadow: inset 0 0 0 1px #e3eeee;
}
.customer-risk-pie strong,
.customer-risk-pie span { position: relative; z-index: 1; display: block; line-height: 1.1; }
.customer-risk-pie strong { color: #123b42; font-size: 21px; }
.customer-risk-pie span { color: var(--muted); font-size: 11px; font-weight: 800; }
.customer-risk-legend { display: grid; gap: 8px; }
.customer-risk-legend span { display: flex; align-items: center; gap: 7px; color: var(--muted-strong); font-size: 12px; font-weight: 800; }
.customer-risk-legend i { width: 9px; height: 9px; border-radius: 999px; }
.customer-risk-legend .high i { background: var(--red); }
.customer-risk-legend .medium i { background: var(--amber); }
.customer-risk-legend .low i { background: var(--green); }
.customer-risk-legend b { margin-left: auto; color: var(--text); }
.customer-risk-pie-row .customer-risk-bars {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.customer-score-board {
  display: grid;
  grid-template-rows: auto auto minmax(0,1fr);
  gap: 10px;
  padding: 12px 14px 14px;
}
.customer-score-head {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 4px 10px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid #d7e5e1;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #f7faf8;
}
.customer-score-head span { color: var(--muted); font-size: 12px; font-weight: 800; }
.customer-score-head strong { color: var(--brand); font-size: 26px; line-height: 1; }
.customer-score-head em { grid-column: 1 / -1; color: var(--muted-strong); font-size: 12px; font-style: normal; }
.customer-score-cues {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 8px;
}
.customer-score-cues div {
  display: grid;
  gap: 4px;
  min-height: 70px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.customer-score-cues span { color: var(--muted); font-size: 12px; line-height: 1.35; }
.customer-score-cues strong { color: #123b42; font-size: 18px; }
.customer-full-table { display: grid; gap: 8px; max-height: min(66vh, 620px); overflow-y: auto; scrollbar-gutter: stable; }
.customer-full-head,
.customer-full-table button {
  display: grid;
  grid-template-columns: minmax(190px,1.4fr) 76px 92px 92px 82px 72px;
  align-items: center;
  gap: 8px;
}
.customer-full-head {
  position: sticky;
  top: 0;
  z-index: 1;
  min-height: 36px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f5faf9;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.customer-full-table button {
  min-height: 46px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
}
.customer-full-table button:hover { border-color: var(--brand); background: #f4fbfa; }
.customer-full-table strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.customer-full-table span { color: var(--muted-strong); font-size: 12px; }
@media (max-width: 1420px) {
  .customer-filter-strip { grid-template-columns: minmax(250px,1fr) minmax(200px,.8fr) 128px minmax(280px,auto) max-content !important; }
  .customer-risk-pie-row { grid-template-columns: 1fr; }
}
@media (max-width: 1180px) {
  .customer-filter-strip { grid-template-columns: 1fr !important; }
  .customer360-layout:not(.is-selected) { grid-template-rows: none; }
  .customer-score-cues, .customer-full-head, .customer-full-table button { grid-template-columns: 1fr; }
}
/* Customer 360 compact counterparty rows */
.customer360-layout:not(.is-selected) { grid-template-rows: minmax(356px,auto) minmax(390px,auto); }
.customer-preview-table,
.customer-rank-list,
.customer-warning-list { gap: 4px; padding: 8px 12px 10px; }
.customer-preview-table,
.customer-rank-list,
.customer-warning-list,
.customer-ai-recommend,
.customer-full-table {
  align-content: start;
  grid-auto-rows: max-content;
}
.customer-preview-table button {
  grid-template-columns: minmax(0,1.25fr) 58px 72px 76px 64px;
  min-height: 28px;
  padding: 2px 8px;
  gap: 6px;
}
.customer-rank-row {
  grid-template-columns: 24px minmax(0,1fr) 50px 74px 54px;
  min-height: 28px;
  padding: 2px 8px;
  gap: 6px;
}
.customer-rank-row b { width: 20px; height: 20px; font-size: 11px; }
.customer-rank-row strong,
.customer-preview-table strong,
.customer-warning-list strong,
.customer-ai-recommend strong { font-size: 13px; }
.customer-rank-row span,
.customer-rank-row em,
.customer-rank-row i,
.customer-preview-table span,
.customer-preview-table em,
.customer-warning-list span,
.customer-warning-list em,
.customer-ai-recommend span,
.customer-ai-recommend em { font-size: 12px; }
.customer-warning-list button,
.customer-ai-recommend button {
  min-height: 40px;
  padding: 4px 8px;
}
.customer-list-status-grid button { min-height: 50px; padding: 6px 8px; }
.customer-list-status-grid strong { font-size: 20px; }
.customer-full-head { min-height: 32px; padding: 0 8px; }
.customer-full-table button { min-height: 32px; padding: 3px 8px; }
/* Customer 360 top-row panel alignment */
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) {
    grid-template-rows: minmax(620px,auto) minmax(390px,auto);
    align-items: stretch;
  }
  .customer360-layout:not(.is-selected) .customer-preview-panel,
  .customer360-layout:not(.is-selected) .customer-rank-panel,
  .customer360-layout:not(.is-selected) .customer-list-panel {
    grid-row: 1;
    height: 100%;
    min-height: 0;
    align-self: stretch;
    overflow: hidden;
  }
  .customer360-layout:not(.is-selected) .customer-risk-panel,
  .customer360-layout:not(.is-selected) .customer-warning-panel,
  .customer360-layout:not(.is-selected) .customer-score-panel {
    grid-row: 2;
  }
  .customer360-layout:not(.is-selected) .customer-preview-table,
  .customer360-layout:not(.is-selected) .customer-rank-list,
  .customer360-layout:not(.is-selected) .customer-list-overview {
    height: 100%;
  }
  .customer360-layout:not(.is-selected) .customer-list-overview {
    grid-template-rows: auto auto minmax(0,1fr);
    overflow: hidden;
  }
  .customer360-layout:not(.is-selected) .customer-ai-recommend {
    max-height: none;
    overflow: visible;
  }
}
/* Customer 360 selector, period, and visual status refinements */
.customer-filter-strip {
  grid-template-columns: minmax(320px,1fr) 190px 118px minmax(330px,auto) max-content !important;
}
.customer-picker-field {
  width: 190px;
  max-width: 190px;
  justify-content: space-between;
  box-sizing: border-box;
}
.customer-picker-field > span,
.customer-period-field > span {
  flex: 0 0 auto;
  white-space: nowrap;
  word-break: keep-all;
}
.customer-picker-field select {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding-right: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.customer-period-field {
  min-width: 112px;
  justify-content: space-between;
}
.customer-period-field select {
  flex: 1 1 auto;
  min-width: 0;
  padding-right: 14px;
}
.customer-list-status-grid button.white {
  border-color: #c7e5d4;
  background: #f2fbf6;
}
.customer-list-status-grid button.white strong,
.customer-list-status-grid button.white span { color: var(--green); }
.customer-list-status-grid button.focus {
  border-color: #ead6a8;
  background: #fffaf0;
}
.customer-list-status-grid button.focus strong,
.customer-list-status-grid button.focus span { color: var(--amber); }
.customer-list-status-grid button.black {
  border-color: #efc6bf;
  background: #fff5f3;
}
.customer-list-status-grid button.black strong,
.customer-list-status-grid button.black span { color: var(--red); }
.customer-list-status-grid button.normal {
  border-color: #d8e0e7;
  background: #f6f8fb;
}
.customer-list-status-grid button.normal strong,
.customer-list-status-grid button.normal span { color: var(--slate); }
.customer-rank-row.high { background: linear-gradient(90deg,#fff5f3,#fff); }
.customer-rank-row.medium { background: linear-gradient(90deg,#fffaf0,#fff); }
.customer-rank-row.low { background: linear-gradient(90deg,#f2fbf6,#fff); }
.customer-rank-risk {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}
.customer-rank-risk.high { background: #fff1ef; color: var(--red); }
.customer-rank-risk.medium { background: #fff7e3; color: var(--amber); }
.customer-rank-risk.low { background: #e9f6ef; color: var(--green); }
.customer-ai-recommend-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}
.customer-ai-recommend-head h4 { min-width: 0; }
.customer-ai-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
}
.customer-ai-badges i { font-style: normal; }
@media (max-width: 1420px) {
  .customer-filter-strip {
    grid-template-columns: minmax(270px,1fr) 180px 112px minmax(280px,auto) max-content !important;
  }
  .customer-picker-field { width: 180px; max-width: 180px; }
}
@media (max-width: 1180px) {
  .customer-filter-strip { grid-template-columns: 1fr !important; }
  .customer-picker-field { width: 100%; max-width: none; }
}
/* Customer 360 header alignment and list color refinements */
.customer-filter-strip {
  grid-template-columns: minmax(320px,1fr) 232px 118px minmax(340px,auto) max-content !important;
  align-items: end !important;
}
.customer-filter-strip > .select-wrap,
.customer-filter-strip > .date-range,
.customer-filter-strip > .filter-meta {
  align-self: end;
  box-sizing: border-box;
  min-height: 40px;
  height: 40px;
}
.customer-picker-field {
  width: 232px;
  max-width: 232px;
  padding-left: 12px;
  padding-right: 30px;
  position: relative;
}
.customer-period-field {
  width: 118px;
  min-width: 118px;
  padding-right: 28px;
  position: relative;
}
.customer-picker-field select,
.customer-period-field select {
  appearance: none;
  -webkit-appearance: none;
  padding-left: 4px;
  padding-right: 2px;
}
.customer-picker-field::after,
.customer-period-field::after {
  content: "";
  position: absolute;
  right: 11px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-right: 2px solid #6a7f85;
  border-bottom: 2px solid #6a7f85;
  transform: translateY(-68%) rotate(45deg);
  pointer-events: none;
}
.customer-date-range {
  display: grid;
  grid-template-columns: auto minmax(128px,1fr) auto minmax(128px,1fr);
  align-items: center;
  min-width: 340px;
  gap: 8px;
}
.customer-date-range span:first-child,
.customer-update-meta span {
  white-space: nowrap;
}
.customer-date-range label { min-width: 0; }
.customer-date-range input {
  width: 100%;
  box-sizing: border-box;
  height: 30px;
}
.customer-update-meta {
  min-width: 168px;
  justify-content: space-between;
}
.customer-ai-recommend button.high { border-left-color: var(--red); background: linear-gradient(90deg,#fff5f3,#fff); }
.customer-ai-recommend button.medium { border-left-color: var(--amber); background: linear-gradient(90deg,#fffaf0,#fff); }
.customer-ai-recommend button.low { border-left-color: var(--green); background: linear-gradient(90deg,#f2fbf6,#fff); }
/* Actionable view-all links open full content; simulated entries remain buttons. */
.customer-view-all-link,
.view-all-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
}
.customer-view-all-link:hover,
.view-all-link:hover {
  background: transparent;
  color: #0a5f58;
  text-decoration: underline;
}
.panel-header .customer-view-all-link { align-self: center; }
.customer-ai-recommend .customer-view-all-link {
  width: auto;
  min-width: 0;
  min-height: auto;
  padding: 0;
  border: 0;
  border-left: 0;
  border-radius: 0;
  background: transparent;
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.customer-ai-recommend .customer-view-all-link:hover {
  background: transparent;
  color: #0a5f58;
  text-decoration: underline;
}
.customer360-layout:not(.is-selected) .customer-rank-list {
  gap: 7px;
}
.customer360-layout:not(.is-selected) .customer-rank-row {
  min-height: 52px;
  padding: 6px 9px;
}
@media (max-width: 1420px) {
  .customer-filter-strip {
    grid-template-columns: minmax(270px,1fr) 218px 112px minmax(320px,auto) max-content !important;
  }
  .customer-picker-field { width: 218px; max-width: 218px; }
  .customer-date-range { min-width: 320px; }
}
@media (max-width: 1180px) {
  .customer-filter-strip { grid-template-columns: 1fr !important; }
  .customer-filter-strip > .select-wrap,
  .customer-filter-strip > .date-range,
  .customer-filter-strip > .filter-meta {
    width: 100%;
    max-width: none;
  }
}

/* Customer 360 list governance actions */
.customer-ai-action-list {
  display: grid;
  gap: 7px;
  min-height: 0;
}
.customer-ai-action-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) 92px;
  gap: 8px;
  align-items: stretch;
  min-height: 62px;
  padding: 8px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--amber);
  border-radius: 8px;
  background: #fff;
}
.customer-ai-action-row.black { border-left-color: #6b1f1a; background: linear-gradient(90deg,#fff1ef,#fff); }
.customer-ai-action-row.focus { border-left-color: var(--amber); background: linear-gradient(90deg,#fff8e8,#fff); }
.customer-ai-action-row.white { border-left-color: var(--green); background: linear-gradient(90deg,#eefaf4,#fff); }
.customer-ai-action-row.normal { border-left-color: #5f7d86; background: linear-gradient(90deg,#f3f7f8,#fff); }
.customer-ai-recommend .customer-ai-main {
  min-height: auto;
  padding: 0;
  border: 0;
  border-left: 0;
  border-radius: 0;
  background: transparent;
  color: var(--text);
}
.customer-ai-recommend .customer-ai-main:hover { background: transparent; }
.customer-ai-action-chip,
.customer-list-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.customer-ai-action-chip {
  min-height: 34px;
  align-self: center;
  padding: 0 10px;
  border: 1px solid var(--line);
}
.customer-ai-action-chip.black,
.customer-list-actions button.black { border-color: #d8bbb7; background: #fff1ef; color: #8d251d; }
.customer-ai-action-chip.focus,
.customer-list-actions button.focus { border-color: #ead6a8; background: #fff7e3; color: #a66d13; }
.customer-ai-action-chip.white,
.customer-list-actions button.white { border-color: #c7e5d4; background: #e9f6ef; color: var(--green); }
.customer-ai-action-chip.normal,
.customer-list-actions button.normal { border-color: #cddce0; background: #f2f6f7; color: #496b74; }
.customer-ai-action-chip:hover,
.customer-list-actions button:hover { border-color: var(--brand); box-shadow: 0 0 0 2px rgba(0,120,108,.08); }
.customer-ai-action-footer,
.customer-modal-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
}
.customer-ai-action-footer button {
  min-height: 30px;
  padding: 0 14px;
  border: 1px solid #b7d8d2;
  border-radius: 7px;
  background: #eef8f5;
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
}
.customer-full-table.is-manage .customer-full-head,
.customer-full-table.is-manage .customer-full-row {
  display: grid;
  grid-template-columns: minmax(560px,1fr) minmax(360px,.72fr);
  gap: 8px;
  align-items: center;
}
.customer-full-table.is-manage .customer-full-head {
  padding: 0;
}
.customer-full-table.is-manage .customer-full-info-head,
.customer-full-table.is-manage .customer-full-main {
  display: grid;
  grid-template-columns: minmax(180px,1.4fr) 82px 96px 94px 88px;
  align-items: center;
  gap: 8px;
}
.customer-full-table.is-manage .customer-full-main {
  min-height: 42px;
  padding: 6px 10px;
}
.customer-full-table.is-manage .customer-full-info-head {
  box-sizing: border-box;
  min-width: 0;
  min-height: 42px;
  padding: 6px 10px;
  border: 1px solid transparent;
  text-align: left;
  justify-items: start;
}
.customer-full-table.is-manage .customer-full-main {
  box-sizing: border-box;
  justify-items: start;
  text-align: left;
}
.customer-full-table.is-manage .customer-full-main > * {
  justify-self: start;
  text-align: left;
}
.customer-full-table.is-manage .customer-full-head > span {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: 42px;
  padding-left: 6px;
  text-align: left;
}
.customer-list-actions {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 6px;
}
.customer-full-table.is-manage .customer-list-actions button {
  min-height: 32px;
  padding: 4px 6px;
  justify-content: flex-start;
  text-align: left;
}
.customer-list-actions button.is-current {
  outline: 2px solid rgba(0,120,108,.18);
  box-shadow: inset 0 0 0 1px rgba(0,120,108,.18);
}
.customer-full-table.is-recommend .customer-full-head,
.customer-recommend-row {
  display: grid;
  grid-template-columns: minmax(220px,1fr) 96px 112px minmax(260px,1.25fr);
  gap: 8px;
  align-items: center;
}
.customer-recommend-row {
  min-height: 46px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.customer-full-table.is-recommend .customer-recommend-row > button:first-child {
  min-height: auto;
  padding: 0;
  border: 0;
  background: transparent;
}
.customer-recommend-row > span { color: var(--muted-strong); font-size: 12px; line-height: 1.35; }
@media (max-width: 1180px) {
  .customer-ai-action-row,
  .customer-full-table.is-manage .customer-full-head,
  .customer-full-table.is-manage .customer-full-row,
  .customer-full-table.is-manage .customer-full-info-head,
  .customer-full-table.is-manage .customer-full-main,
  .customer-full-table.is-recommend .customer-full-head,
  .customer-recommend-row {
    grid-template-columns: 1fr;
  }
  .customer-list-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
/* Select hit-area and Customer 360 smooth picker */
.select-wrap,
.select-wrap select,
.risk-period-field,
.risk-period-field select,
.login-field select,
.business-form select,
.review-setting-grid select {
  cursor: pointer;
}
.select-wrap:focus-within,
.risk-period-field:focus-within {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(15,118,110,.1);
}
.customer-picker-field {
  cursor: pointer;
  overflow: visible;
  z-index: 28;
}
.customer-picker-field select {
  position: absolute;
  width: 1px;
  height: 1px;
  min-width: 0;
  opacity: 0;
  pointer-events: none;
}
.customer-picker-field > .customer-select-trigger {
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
}.customer-select-trigger {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  padding-right: 2px;
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  line-height: 38px;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.customer-select-trigger:focus-visible {
  outline: 2px solid rgba(15,118,110,.35);
  outline-offset: 3px;
  border-radius: 5px;
}
.customer-picker-field::after,
.customer-period-field::after {
  cursor: pointer;
}
.customer-select-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: min(390px, calc(100vw - 40px));
  max-height: 324px;
  padding: 7px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
  border: 1px solid #cfe0dd;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 18px 38px rgba(17,54,62,.15);
  opacity: 0;
  transform: translateY(-6px) scale(.985);
  transform-origin: top left;
  transition: opacity .16s ease, transform .16s ease;
  pointer-events: none;
}
.customer-select-menu.is-open {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
.customer-select-option {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 2px 10px;
  width: 100%;
  min-height: 52px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
  cursor: pointer;
}
.customer-select-option + .customer-select-option { margin-top: 4px; }
.customer-select-option strong {
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-select-option span {
  overflow: hidden;
  color: var(--muted-strong);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-select-option em {
  grid-row: 1 / span 2;
  grid-column: 2;
  align-self: center;
}
.customer-select-option:hover,
.customer-select-option.is-selected {
  border-color: #b7d8d2;
  background: #f4fbfa;
}
.customer-select-option.is-selected {
  box-shadow: inset 3px 0 0 var(--brand);
}
@media (max-width: 760px) {
  .customer-select-menu { width: min(100%, calc(100vw - 32px)); }
}
/* Unified compact select dropdowns and clearer customer risk/list semantics */
.select-wrap {
  position: relative;
  overflow: visible;
  --select-value-left: 48px;
  padding-right: 30px;
  cursor: default;
}
.select-wrap > span:first-child {
  flex: 0 0 auto;
  white-space: nowrap;
  cursor: default;
}
.select-wrap::after {
  content: "";
  position: absolute;
  right: 11px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-right: 2px solid #6a7f85;
  border-bottom: 2px solid #6a7f85;
  transform: translateY(-68%) rotate(45deg);
  pointer-events: none;
}
.select-wrap select {
  position: absolute;
  width: 1px;
  height: 1px;
  min-width: 0;
  opacity: 0;
  pointer-events: none;
}
.select-proxy-trigger,
.customer-select-trigger {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  line-height: 38px;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.select-proxy-trigger:focus-visible,
.customer-select-trigger:focus-visible {
  outline: 2px solid rgba(15,118,110,.35);
  outline-offset: 3px;
  border-radius: 5px;
}
.select-proxy-menu,
.customer-select-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: var(--select-value-left, 48px);
  right: 0;
  width: auto;
  min-width: 0;
  max-height: 300px;
  padding: 6px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
  border: 1px solid #cfe0dd;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 18px 38px rgba(17,54,62,.15);
  opacity: 0;
  transform: translateY(-8px) scale(.98);
  transform-origin: top left;
  transition: opacity .18s ease, transform .18s cubic-bezier(.2,.8,.2,1);
  pointer-events: none;
  z-index: 70;
}
.select-proxy-menu.is-open,
.customer-select-menu.is-open {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
.select-proxy-option,
.customer-select-option {
  display: block;
  width: 100%;
  min-height: 34px;
  padding: 7px 9px;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.select-proxy-option + .select-proxy-option,
.customer-select-option + .customer-select-option { margin-top: 4px; }
.select-proxy-option:hover,
.select-proxy-option.is-selected,
.customer-select-option:hover,
.customer-select-option.is-selected {
  border-color: #b7d8d2;
  background: #f4fbfa;
}
.select-proxy-option.is-selected,
.customer-select-option.is-selected {
  color: var(--brand);
  box-shadow: inset 3px 0 0 var(--brand);
}
.customer-filter-strip {
  grid-template-columns: minmax(230px,260px) 270px 154px minmax(260px,1fr) max-content !important;
}
.customer-picker-field {
  --select-value-left: 82px;
  width: 270px;
  max-width: 270px;
  cursor: default;
}
.customer-period-field { --select-value-left: 48px; }
.customer-picker-field > .customer-select-trigger { white-space: nowrap; }
.customer-date-range { min-width: 260px; }
.customer-risk {
  border: 1px solid transparent;
  background: #fff;
}
.customer-risk.high,
.customer-rank-risk.high {
  border-color: #efb5ad;
  background: #fff4f2;
  color: #b3261e;
}
.customer-risk.medium,
.customer-rank-risk.medium {
  border-color: #ead6a8;
  background: #fff8e8;
  color: #9a640f;
}
.customer-risk.low,
.customer-rank-risk.low {
  border-color: #c7e5d4;
  background: #eef8f3;
  color: #17855b;
}
.customer-list-badge {
  border: 1px solid transparent;
}
.customer-list-badge.white {
  border-color: #b9d6f2;
  background: #edf6ff;
  color: #075a9b;
}
.customer-list-badge.focus {
  border-color: #c8c7f5;
  background: #f1f0ff;
  color: #4b4ab8;
}
.customer-list-badge.black {
  border-color: #26323a;
  background: #26323a;
  color: #fff;
}
.customer-list-badge.normal {
  border-color: #d8e0e7;
  background: #f6f8fb;
  color: #4b5d67;
}
.customer-list-status-grid button.white,
.customer-ai-action-chip.white,
.customer-list-actions button.white {
  border-color: #b9d6f2;
  background: #edf6ff;
  color: #075a9b;
}
.customer-list-status-grid button.focus,
.customer-ai-action-chip.focus,
.customer-list-actions button.focus {
  border-color: #c8c7f5;
  background: #f1f0ff;
  color: #4b4ab8;
}
.customer-list-status-grid button.black,
.customer-ai-action-chip.black,
.customer-list-actions button.black {
  border-color: #26323a;
  background: #26323a;
  color: #fff;
}
.customer-list-status-grid button.normal,
.customer-ai-action-chip.normal,
.customer-list-actions button.normal {
  border-color: #d8e0e7;
  background: #f6f8fb;
  color: #4b5d67;
}
.customer-list-status-grid button.white strong,
.customer-list-status-grid button.white span { color: #075a9b; }
.customer-list-status-grid button.focus strong,
.customer-list-status-grid button.focus span { color: #4b4ab8; }
.customer-list-status-grid button.black strong,
.customer-list-status-grid button.black span { color: #fff; }
.customer-list-status-grid button.normal strong,
.customer-list-status-grid button.normal span { color: #4b5d67; }
@media (max-width: 1420px) {
  .customer-filter-strip {
    grid-template-columns: 230px 250px 148px minmax(250px,1fr) max-content !important;
  }
  .customer-picker-field { width: 250px; max-width: 250px; }
  .customer-date-range { min-width: 250px; }
}
@media (max-width: 1180px) {
  .customer-filter-strip { grid-template-columns: 1fr !important; }
  .customer-picker-field,
  .customer-period-field { width: 100%; max-width: none; }
  .select-proxy-menu,
  .customer-select-menu { left: var(--select-value-left, 48px); }
}
/* Period dropdown width fix and softer blacklist status palette */
.select-wrap:has(#periodSelect),
.select-wrap:has(#riskPeriodSelect),
.customer-period-field {
  width: 154px;
  min-width: 154px;
  max-width: 154px;
  --select-value-left: 48px;
}
.select-wrap:has(#periodSelect) .select-proxy-menu,
.select-wrap:has(#riskPeriodSelect) .select-proxy-menu,
.customer-period-field .select-proxy-menu {
  max-height: 280px;
}
.select-wrap:has(#periodSelect) .select-proxy-option,
.select-wrap:has(#riskPeriodSelect) .select-proxy-option,
.customer-period-field .select-proxy-option {
  padding-left: 10px;
  padding-right: 10px;
  font-size: 13px;
}
.customer-list-badge.black,
.customer-ai-action-chip.black,
.customer-list-actions button.black {
  border-color: #4b1634;
  background: #4b1634;
  color: #fff;
}
.customer-list-status-grid button.black {
  border-color: #4b1634;
  background: linear-gradient(180deg,#5b1c40,#4b1634);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}
.customer-list-status-grid button.black strong,
.customer-list-status-grid button.black span {
  color: #fff;
}
.customer-ai-action-row.black {
  border-left-color: #4b1634;
  background: linear-gradient(90deg,#f4e8ef,#fff);
}
.customer-ai-action-chip.black:hover,
.customer-list-actions button.black:hover,
.customer-list-status-grid button.black:hover {
  border-color: #351025;
  background: #351025;
  color: #fff;
}
@media (max-width: 1420px) {
  .select-wrap:has(#periodSelect),
  .select-wrap:has(#riskPeriodSelect),
  .customer-period-field {
    width: 148px;
    min-width: 148px;
    max-width: 148px;
  }
}
@media (max-width: 1180px) {
  .select-wrap:has(#periodSelect),
  .select-wrap:has(#riskPeriodSelect),
  .customer-period-field {
    width: 100%;
    max-width: none;
  }
}
/* Dropdown close animation parity */
.select-proxy-menu,
.customer-select-menu {
  transition: opacity .22s ease, transform .22s cubic-bezier(.2,.8,.2,1);
  will-change: opacity, transform;
}
.select-proxy-menu.is-closing,
.customer-select-menu.is-closing {
  opacity: 0;
  transform: translateY(-8px) scale(.98);
}
/* Final dropdown cursor and close-state hardening */
.select-wrap,
.customer-picker-field,
.customer-period-field {
  cursor: pointer !important;
}
.select-wrap > span:first-child,
.customer-picker-field > span:first-child,
.customer-period-field > span:first-child {
  cursor: pointer !important;
}
.select-wrap::after,
.customer-picker-field::after,
.customer-period-field::after {
  pointer-events: none;
}
.select-proxy-trigger,
.customer-select-trigger,
.select-proxy-option,
.customer-select-option {
  cursor: pointer !important;
}
.select-proxy-menu.is-closing,
.customer-select-menu.is-closing {
  pointer-events: none;
}
/* Customer 360 17-row counterparty list alignment */
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) {
    grid-template-rows: minmax(646px, auto) minmax(390px, auto);
  }
  .customer360-layout:not(.is-selected) .customer-preview-panel,
  .customer360-layout:not(.is-selected) .customer-rank-panel,
  .customer360-layout:not(.is-selected) .customer-list-panel {
    min-height: 646px;
    max-height: 646px;
  }
  .customer360-layout:not(.is-selected) .customer-preview-table {
    flex: 0 0 574px;
    height: 574px;
    max-height: 574px;
    gap: 3px;
    padding: 8px 12px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-gutter: stable;
  }
  .customer360-layout:not(.is-selected) .customer-preview-table button {
    box-sizing: border-box;
    min-height: 30px;
    height: 30px;
    padding: 2px 8px;
    gap: 6px;
  }
  .customer360-layout:not(.is-selected) .customer-preview-table strong,
  .customer360-layout:not(.is-selected) .customer-preview-table span,
  .customer360-layout:not(.is-selected) .customer-preview-table em,
  .customer360-layout:not(.is-selected) .customer-preview-table i,
  .customer360-layout:not(.is-selected) .customer-preview-table b {
    line-height: 1.15;
  }
  .customer360-layout:not(.is-selected) .customer-rank-list,
  .customer360-layout:not(.is-selected) .customer-list-overview {
    height: auto;
    flex: 1 1 auto;
    min-height: 0;
  }
  .customer360-layout:not(.is-selected) .customer-rank-list {
    overflow: visible;
    gap: 5px;
    padding: 8px 12px;
  }
  .customer360-layout:not(.is-selected) .customer-rank-row {
    min-height: 47px;
    height: 47px;
    padding: 5px 9px;
  }
  .customer360-layout:not(.is-selected) .customer-list-overview {
    grid-template-rows: auto auto minmax(0,1fr);
  }
  .customer360-layout:not(.is-selected) .customer-ai-recommend {
    display: grid;
    grid-template-rows: auto minmax(0,1fr) auto;
    min-height: 0;
    overflow: hidden;
  }
  .customer360-layout:not(.is-selected) .customer-ai-action-list {
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-gutter: stable;
  }
  .customer360-layout:not(.is-selected) .customer-ai-action-footer {
    flex: 0 0 auto;
    padding-top: 4px;
  }
}

/* Customer 360 status grid horizontal refinement */
.customer360-layout:not(.is-selected) .customer-list-status-grid button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  padding: 7px 8px;
  text-align: center;
}
.customer360-layout:not(.is-selected) .customer-list-status-grid strong,
.customer360-layout:not(.is-selected) .customer-list-status-grid span {
  line-height: 1;
  white-space: nowrap;
}
.customer360-layout:not(.is-selected) .customer-ai-action-footer button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 16px;
  line-height: 1;
}

/* Customer 360 compact top-row final tuning */
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) {
    grid-template-rows: minmax(616px, auto) minmax(390px, auto);
  }
  .customer360-layout:not(.is-selected) .customer-preview-panel,
  .customer360-layout:not(.is-selected) .customer-rank-panel,
  .customer360-layout:not(.is-selected) .customer-list-panel {
    min-height: 616px;
    max-height: 616px;
  }
  .customer360-layout:not(.is-selected) .customer-preview-table {
    flex: 0 0 542px;
    height: 542px;
    max-height: 542px;
    gap: 2px;
    padding: 8px 12px;
  }
  .customer360-layout:not(.is-selected) .customer-preview-table button {
    min-height: 29px;
    height: 29px;
    padding: 2px 8px;
  }
  .customer360-layout:not(.is-selected) .customer-rank-list {
    gap: 4px;
    padding: 8px 12px;
  }
  .customer360-layout:not(.is-selected) .customer-rank-row {
    min-height: 45px;
    height: 45px;
    padding: 4px 9px;
  }
  .customer360-layout:not(.is-selected) .customer-list-status-grid button {
    justify-content: flex-start;
    gap: 10px;
    min-height: 42px;
    padding: 6px 10px;
  }
  .customer360-layout:not(.is-selected) .customer-list-status-grid strong {
    min-width: 34px;
    font-size: 26px;
    text-align: left;
  }
  .customer360-layout:not(.is-selected) .customer-list-status-grid span {
    font-size: 12px;
    text-align: left;
  }
  .customer360-layout:not(.is-selected) .customer-ai-action-row {
    grid-template-columns: minmax(0,1fr) 82px;
    gap: 6px;
    min-height: 52px;
    padding: 6px;
  }
  .customer360-layout:not(.is-selected) .customer-ai-recommend .customer-ai-main {
    gap: 2px;
  }
  .customer360-layout:not(.is-selected) .customer-ai-recommend .customer-ai-main span {
    line-height: 1.2;
  }
  .customer360-layout:not(.is-selected) .customer-ai-badges {
    gap: 4px;
  }
  .customer360-layout:not(.is-selected) .customer-ai-action-chip {
    min-height: 28px;
    padding: 0 8px;
  }
}

/* Customer 360 AI recommendation right-edge alignment */
.customer360-layout:not(.is-selected) .customer-ai-action-list {
  scrollbar-gutter: auto;
}
.customer360-layout:not(.is-selected) .customer-ai-action-row {
  width: 100%;
  box-sizing: border-box;
}

/* Customer 360 top-panel baseline alignment */
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) {
    grid-template-rows: minmax(596px, auto) minmax(390px, auto);
  }
  .customer360-layout:not(.is-selected) .customer-preview-panel,
  .customer360-layout:not(.is-selected) .customer-rank-panel,
  .customer360-layout:not(.is-selected) .customer-list-panel {
    min-height: 596px;
    max-height: 596px;
  }
  .customer360-layout:not(.is-selected) .customer-preview-panel > .panel-header,
  .customer360-layout:not(.is-selected) .customer-rank-panel > .panel-header,
  .customer360-layout:not(.is-selected) .customer-list-panel > .panel-header {
    min-height: 55px;
    padding: 12px 14px 0;
    align-items: flex-start;
  }
  .customer360-layout:not(.is-selected) .customer-preview-panel > .panel-header h3,
  .customer360-layout:not(.is-selected) .customer-rank-panel > .panel-header h3,
  .customer360-layout:not(.is-selected) .customer-list-panel > .panel-header h3 {
    font-size: 16px;
    line-height: 20px;
  }
  .customer360-layout:not(.is-selected) .customer-preview-panel > .panel-header p,
  .customer360-layout:not(.is-selected) .customer-rank-panel > .panel-header p,
  .customer360-layout:not(.is-selected) .customer-list-panel > .panel-header p {
    margin-top: 4px;
    line-height: 18px;
  }
  .customer360-layout:not(.is-selected) .customer-preview-table {
    flex: 0 0 533px;
    height: 533px;
    max-height: 533px;
    gap: 2px;
    padding: 8px 12px 0;
  }
  .customer360-layout:not(.is-selected) .customer-preview-table button {
    min-height: 29px;
    height: 29px;
  }
  .customer360-layout:not(.is-selected) .customer-rank-list {
    flex: 0 0 533px;
    height: 533px;
    max-height: 533px;
    gap: 4px;
    padding: 8px 12px 0;
    overflow: visible;
  }
  .customer360-layout:not(.is-selected) .customer-rank-row {
    min-height: 48.9px;
    height: 48.9px;
    padding: 4px 9px;
  }
  .customer360-layout:not(.is-selected) .customer-list-overview {
    flex: 0 0 533px;
    height: 533px;
    max-height: 533px;
    gap: 8px;
    padding: 8px 14px 0;
    grid-template-rows: auto auto minmax(0,1fr);
  }
  .customer360-layout:not(.is-selected) .customer-ai-recommend {
    min-height: 0;
  }
}

/* Customer 360 final top-row title alignment override */
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-preview-panel > .panel-header > div,
  .customer360-layout:not(.is-selected) .customer-rank-panel > .panel-header > div,
  .customer360-layout:not(.is-selected) .customer-list-panel > .panel-header > div {
    transform: translateY(3px);
  }
  .customer360-layout:not(.is-selected) .customer-preview-panel > .panel-header h3,
  .customer360-layout:not(.is-selected) .customer-rank-panel > .panel-header h3,
  .customer360-layout:not(.is-selected) .customer-list-panel > .panel-header h3 {
    font-size: 18px;
    line-height: 20px;
    font-weight: 900;
  }
}

/* Customer 360 ranking field emphasis */
.customer-rank-row .customer-rank-type {
  color: var(--muted-strong);
  font-weight: 700;
  white-space: nowrap;
}
.customer-rank-row .customer-rank-amount {
  color: #0b5f59;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0;
  white-space: nowrap;
}
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-rank-row {
    grid-template-columns: 24px minmax(0,1fr) 50px 74px 54px;
  }
}
/* Keep Customer 360 filters underneath the sticky top navigation while scrolling. */
.customer-filter-strip {
  position: relative;
  z-index: 2;
  isolation: isolate;
}

/* Customer list status filters can be toggled off by clicking the active card again. */
.customer-list-status-grid button.is-active {
  border-color: var(--brand) !important;
  outline: 2px solid rgba(15,118,110,.22);
  outline-offset: 2px;
  box-shadow: 0 8px 18px rgba(15,118,110,.12);
}
.customer-list-status-grid button.is-active span::after {
  content: " · 已筛选";
  font-weight: 900;
}
.customer-list-status-grid button.black.is-active {
  outline-color: rgba(75,22,52,.32);
  box-shadow: 0 8px 18px rgba(75,22,52,.16);
}


/* Customer 360 AI recommendation execution state */
.customer-ai-count {
  color: var(--muted-strong);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.customer-ai-action-list {
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 2px;
}
.customer-ai-action-footer button:disabled {
  opacity: .48;
  cursor: not-allowed;
  box-shadow: none;
}
.customer-ai-action-footer button:disabled:hover {
  border-color: #b7d8d2;
  background: #eef8f5;
}


/* Customer 360 AI recommendation full-width alignment */
.customer360-layout:not(.is-selected) .customer-ai-recommend {
  align-content: start;
  grid-template-rows: auto 170px auto;
  scrollbar-gutter: auto;
}
.customer360-layout:not(.is-selected) .customer-ai-action-list {
  width: 100%;
  height: 170px;
  max-height: 170px;
  padding-right: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.customer360-layout:not(.is-selected) .customer-ai-action-list::-webkit-scrollbar {
  width: 0;
  height: 0;
}
.customer360-layout:not(.is-selected) .customer-ai-action-row,
.customer360-layout:not(.is-selected) .customer-ai-action-footer {
  width: 100%;
  box-sizing: border-box;
}

.customer360-layout:not(.is-selected) .customer-ai-action-list .customer-empty {
  display: grid;
  place-items: center;
  min-height: 170px;
  height: 170px;
  box-sizing: border-box;
}


/* Customer 360 AI recommendation badge anti-wrap */
.customer360-layout:not(.is-selected) .customer-ai-recommend .customer-ai-main {
  min-width: 0;
  overflow: hidden;
}
.customer360-layout:not(.is-selected) .customer-ai-recommend .customer-ai-main strong,
.customer360-layout:not(.is-selected) .customer-ai-recommend .customer-ai-main > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer360-layout:not(.is-selected) .customer-ai-badges {
  flex-wrap: nowrap;
  align-items: center;
  min-width: 0;
  overflow: hidden;
}
.customer360-layout:not(.is-selected) .customer-ai-badges .customer-risk,
.customer360-layout:not(.is-selected) .customer-ai-badges .customer-list-badge {
  flex: 0 0 auto;
  white-space: nowrap;
  min-height: 20px;
  padding: 1px 7px;
  line-height: 18px;
}


/* Customer 360 AI recommendation card layout refinement */
.customer360-layout:not(.is-selected) .customer-ai-recommend {
  grid-template-rows: auto 224px auto;
}
.customer360-layout:not(.is-selected) .customer-ai-action-list {
  height: 224px;
  max-height: 224px;
}
.customer360-layout:not(.is-selected) .customer-ai-action-row {
  position: relative;
  display: block;
  min-height: 70px;
  height: 70px;
  padding: 7px 8px;
}
.customer360-layout:not(.is-selected) .customer-ai-recommend .customer-ai-main {
  display: grid;
  width: 100%;
  gap: 2px;
  padding: 0;
}
.customer360-layout:not(.is-selected) .customer-ai-badges {
  padding-right: 92px;
}
.customer360-layout:not(.is-selected) .customer-ai-action-chip {
  position: absolute;
  right: 8px;
  bottom: 7px;
  min-height: 24px;
  height: 24px;
  padding: 0 8px;
  font-size: 11px;
}
.customer360-layout:not(.is-selected) .customer-ai-action-list .customer-empty {
  min-height: 224px;
  height: 224px;
}


/* Customer 360 AI recommendation vertical alignment */
.customer360-layout:not(.is-selected) .customer-ai-recommend {
  grid-template-rows: auto 280px auto;
}
.customer360-layout:not(.is-selected) .customer-ai-action-list {
  height: 280px;
  max-height: 280px;
}
.customer360-layout:not(.is-selected) .customer-ai-action-row {
  min-height: 88px;
  height: 88px;
  padding: 8px 9px;
}
.customer360-layout:not(.is-selected) .customer-ai-recommend .customer-ai-main {
  gap: 4px;
}
.customer360-layout:not(.is-selected) .customer-ai-action-chip {
  right: 9px;
  bottom: 8px;
}
.customer360-layout:not(.is-selected) .customer-ai-action-list .customer-empty {
  min-height: 280px;
  height: 280px;
}


/* Customer 360 AI recommendation header actions */
.customer-ai-head-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
  white-space: nowrap;
}
.customer-ai-head-actions .customer-view-all-link {
  flex: 0 0 auto;
}


/* Customer 360 recommendation modal table alignment */
.customer-full-table.is-recommend {
  gap: 8px;
}
.customer-full-table.is-recommend .customer-full-head,
.customer-full-table.is-recommend .customer-recommend-row {
  display: grid;
  grid-template-columns: minmax(260px,1.12fr) minmax(132px,.56fr) minmax(152px,.64fr) minmax(360px,1.55fr);
  gap: 12px;
  align-items: stretch;
}
.customer-full-table.is-recommend .customer-full-head {
  min-height: 38px;
  padding: 0 10px;
}
.customer-full-table.is-recommend .customer-full-head span {
  display: flex;
  align-items: center;
  min-width: 0;
  color: #335961;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
  white-space: nowrap;
}
.customer-full-table.is-recommend .customer-recommend-row {
  min-height: 62px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #f9fcfb;
}
.customer-full-table.is-recommend .customer-recommend-row > * {
  min-width: 0;
  box-sizing: border-box;
}
.customer-full-table.is-recommend .customer-recommend-main,
.customer-full-table.is-recommend .customer-recommend-status,
.customer-full-table.is-recommend .customer-recommend-action-cell,
.customer-full-table.is-recommend .customer-recommend-reason {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 10px;
  border: 1px solid #e0ece9;
  border-radius: 8px;
  background: #fff;
}
.customer-full-table.is-recommend .customer-recommend-main {
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 3px;
  border-color: #d7e7e4;
  text-align: left;
}
.customer-full-table.is-recommend .customer-recommend-main strong,
.customer-full-table.is-recommend .customer-recommend-main span,
.customer-full-table.is-recommend .customer-recommend-reason {
  overflow: hidden;
  text-overflow: ellipsis;
}
.customer-full-table.is-recommend .customer-recommend-main strong,
.customer-full-table.is-recommend .customer-recommend-main span {
  max-width: 100%;
  white-space: nowrap;
}
.customer-full-table.is-recommend .customer-recommend-status,
.customer-full-table.is-recommend .customer-recommend-action-cell {
  justify-content: center;
}
.customer-full-table.is-recommend .customer-recommend-action-cell .customer-ai-action-chip {
  width: 100%;
  min-height: 30px;
  padding: 0 10px;
}
.customer-full-table.is-recommend .customer-recommend-reason {
  color: var(--muted-strong);
  font-size: 12px;
  line-height: 1.35;
}
@media (max-width: 1180px) {
  .customer-full-table.is-recommend .customer-full-head,
  .customer-full-table.is-recommend .customer-recommend-row {
    grid-template-columns: 1fr;
  }
}


/* Customer 360 recommendation modal six-column fix */
.customer-full-table.is-recommend .customer-full-head,
.customer-full-table.is-recommend .customer-recommend-row {
  grid-template-columns: minmax(180px,1.18fr) 96px 112px 132px 152px minmax(300px,1.7fr);
  gap: 10px;
}
.customer-full-table.is-recommend .customer-recommend-main,
.customer-full-table.is-recommend .customer-recommend-type,
.customer-full-table.is-recommend .customer-recommend-amount,
.customer-full-table.is-recommend .customer-recommend-status,
.customer-full-table.is-recommend .customer-recommend-action-cell,
.customer-full-table.is-recommend .customer-recommend-reason {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center;
  min-width: 0;
  min-height: 44px;
  padding: 8px 10px;
  border: 1px solid #e0ece9;
  border-radius: 8px;
  background: #fff;
  box-sizing: border-box;
}
.customer-full-table.is-recommend .customer-recommend-main {
  justify-content: flex-start;
  width: 100%;
  color: var(--text);
  text-align: left;
}
.customer-full-table.is-recommend .customer-recommend-main strong {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-full-table.is-recommend .customer-recommend-type,
.customer-full-table.is-recommend .customer-recommend-status,
.customer-full-table.is-recommend .customer-recommend-action-cell {
  justify-content: center;
}
.customer-full-table.is-recommend .customer-recommend-amount {
  justify-content: flex-end;
  color: #0b5f59;
  font-weight: 900;
  white-space: nowrap;
}
.customer-full-table.is-recommend .customer-recommend-action-button {
  display: inline-flex !important;
  grid-template-columns: none !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  box-sizing: border-box;
}
.customer-full-table.is-recommend .customer-recommend-action-button.black { border-color: #d8bbb7; background: #fff1ef; color: #8d251d; }
.customer-full-table.is-recommend .customer-recommend-action-button.focus { border-color: #ead6a8; background: #fff7e3; color: #a66d13; }
.customer-full-table.is-recommend .customer-recommend-action-button.white { border-color: #c7e5d4; background: #e9f6ef; color: var(--green); }
.customer-full-table.is-recommend .customer-recommend-action-button.normal { border-color: #cddce0; background: #f2f6f7; color: #496b74; }
.customer-full-table.is-recommend .customer-recommend-action-button:hover {
  border-color: var(--brand);
  box-shadow: 0 0 0 2px rgba(0,120,108,.08);
}
.customer-full-table.is-recommend .customer-recommend-reason {
  color: var(--muted-strong);
  font-size: 12px;
  line-height: 1.35;
}


/* Customer 360 recommendation modal table final alignment */
.customer-full-table.is-recommend .customer-full-head span {
  justify-content: center;
  text-align: center;
}
.customer-full-table.is-recommend .customer-recommend-row {
  align-items: center;
  border-color: #dce9e6;
  background: #f7faf9;
}
.customer-full-table.is-recommend .customer-recommend-main,
.customer-full-table.is-recommend .customer-recommend-type,
.customer-full-table.is-recommend .customer-recommend-amount,
.customer-full-table.is-recommend .customer-recommend-status,
.customer-full-table.is-recommend .customer-recommend-action-cell,
.customer-full-table.is-recommend .customer-recommend-reason {
  justify-content: center !important;
  min-height: 42px;
  padding: 6px 8px;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  text-align: center !important;
}
.customer-full-table.is-recommend .customer-recommend-main {
  width: 100%;
}
.customer-full-table.is-recommend .customer-recommend-main strong,
.customer-full-table.is-recommend .customer-recommend-type,
.customer-full-table.is-recommend .customer-recommend-amount,
.customer-full-table.is-recommend .customer-recommend-reason {
  display: block;
  width: 100%;
  text-align: center !important;
}
.customer-full-table.is-recommend .customer-recommend-amount {
  color: #0b5f59;
  font-weight: 900;
}
.customer-full-table.is-recommend .customer-recommend-reason {
  display: flex;
  align-items: center;
}
.customer-full-table.is-recommend .customer-recommend-action-button {
  width: min(128px, 100%);
  margin: 0 auto;
}

/* Customer cert and authorization page */
.customer-cert-auth-view.is-active {
  display: grid;
  gap: 12px;
}
.customer-cert-auth-layout {
  display: grid;
  grid-template-columns: repeat(12,minmax(0,1fr));
  gap: 12px;
  align-items: stretch;
}
.cert-auth-kpis {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 10px;
}
.cert-auth-ledger-panel { grid-column: 1 / span 8; }
.cert-auth-warning-panel { grid-column: 9 / span 4; }
.cert-auth-basis-panel { grid-column: 1 / span 5; }
.cert-auth-scope-panel { grid-column: 6 / span 7; }
.cert-auth-table,
.cert-auth-warning-list,
.cert-auth-basis-list,
.cert-auth-scope-grid {
  display: grid;
  gap: 8px;
  padding: 12px 14px 14px;
}
.cert-auth-table { max-height: 430px; overflow-y: auto; scrollbar-gutter: stable; }
.cert-auth-table-head,
.cert-auth-row {
  display: grid;
  grid-template-columns: minmax(0,1.35fr) 72px minmax(0,1.15fr) minmax(0,1.15fr) 82px 92px;
  align-items: center;
  gap: 8px;
}
.cert-auth-table-head {
  min-height: 34px;
  padding: 0 10px;
  border-radius: 8px;
  background: #eef6f5;
  color: #31575c;
  font-size: 12px;
  font-weight: 900;
  text-align: center;
}
.cert-auth-row {
  min-height: 52px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand-2);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
}
.cert-auth-row.high { border-left-color: var(--red); }
.cert-auth-row.medium { border-left-color: var(--amber); }
.cert-auth-row.low { border-left-color: var(--green); }
.cert-auth-row:hover { border-color: var(--brand); background: #f4fbfa; }
.cert-auth-row strong,
.cert-auth-row span,
.cert-auth-row em,
.cert-auth-row b,
.cert-auth-row i { min-width: 0; }
.cert-auth-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.cert-auth-row span,
.cert-auth-row em { color: var(--muted-strong); font-size: 12px; font-style: normal; line-height: 1.35; }
.cert-auth-row b { color: #0b5f59; font-size: 12px; }
.cert-auth-warning-list { max-height: 430px; overflow-y: auto; scrollbar-gutter: stable; }
.cert-auth-warning-list button {
  display: grid;
  grid-template-columns: minmax(0,1.15fr) minmax(0,1.3fr) minmax(0,1.3fr) 92px;
  align-items: center;
  gap: 8px;
  min-height: 58px;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand-2);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
}
.cert-auth-warning-list button.high { border-left-color: var(--red); }
.cert-auth-warning-list button.medium { border-left-color: var(--amber); }
.cert-auth-warning-list button.low { border-left-color: var(--green); }
.cert-auth-warning-list button:hover { border-color: var(--brand); background: #f4fbfa; }
.cert-auth-warning-list strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.cert-auth-warning-list span { color: var(--muted-strong); font-size: 12px; line-height: 1.35; }
.cert-auth-warning-list .customer-list-badge { justify-self: end; }
.cert-auth-basis-list div {
  display: grid;
  grid-template-columns: 28px minmax(0,0.8fr) minmax(0,1.7fr);
  align-items: center;
  gap: 9px;
  min-height: 58px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.cert-auth-basis-list b {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: #e9f6ef;
  color: var(--brand);
}
.cert-auth-basis-list strong { color: var(--text); font-size: 13px; }
.cert-auth-basis-list span { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.cert-auth-scope-grid {
  grid-template-columns: repeat(2,minmax(0,1fr));
}
.cert-auth-scope-grid article {
  display: grid;
  gap: 7px;
  min-height: 112px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.cert-auth-scope-grid strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); font-size: 13px; }
.cert-auth-scope-grid span { color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.cert-auth-scope-grid em { justify-self: start; font-style: normal; }
.customer-warning-list .customer-warning-row {
  display: grid;
  grid-template-columns: minmax(0,1.15fr) 72px minmax(0,1.55fr) 92px;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 8px 10px;
}
.customer-warning-list .customer-warning-row strong,
.customer-warning-list .customer-warning-row span,
.customer-warning-list .customer-warning-row em,
.customer-warning-list .customer-warning-row i { min-width: 0; }
.customer-warning-list .customer-warning-row span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-warning-list .customer-warning-row em {
  color: var(--muted-strong);
  font-size: 12px;
  font-style: normal;
}
.customer-warning-list .customer-warning-row .customer-list-badge {
  justify-self: end;
}
@media (max-width: 1180px) {
  .cert-auth-kpis,
  .customer-cert-auth-layout { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .cert-auth-kpis,
  .cert-auth-ledger-panel,
  .cert-auth-warning-panel,
  .cert-auth-basis-panel,
  .cert-auth-scope-panel { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .cert-auth-kpis,
  .customer-cert-auth-layout,
  .cert-auth-scope-grid { grid-template-columns: 1fr; }
  .cert-auth-table-head { display: none; }
  .cert-auth-row,
  .cert-auth-warning-list button,
  .customer-warning-list .customer-warning-row { grid-template-columns: 1fr; }
}
/* Customer overview certificate warning list density */
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-warning-list {
    max-height: 588px;
    overflow-y: auto;
    scrollbar-gutter: stable;
  }
  .customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row {
    min-height: 79.4px;
    padding-top: 8px;
    padding-bottom: 8px;
  }
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row strong,
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row em,
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row .customer-list-badge {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row .customer-list-badge {
  max-width: 92px;
}
/* Customer overview certificate warning scroll frame alignment */
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-warning-list {
    display: block;
    height: 588px;
    max-height: 588px;
    padding: 8px 12px 14px;
    overflow: hidden;
    scrollbar-gutter: auto;
  }
  .customer360-layout:not(.is-selected) .customer-warning-scroll {
    display: grid;
    gap: 4px;
    align-content: start;
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-gutter: stable;
  }
  .customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row {
    height: 77.43px;
    min-height: 77.43px;
    padding-top: 8px;
    padding-bottom: 8px;
  }
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row {
  text-align: center;
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row strong,
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row em,
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row span,
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row .customer-list-badge {
  justify-self: center;
  text-align: center;
}
/* Customer table cell overflow protection */
.customer-preview-table button,
.customer-rank-row,
.customer-warning-list .customer-warning-row,
.customer-full-table .customer-full-head,
.customer-full-table .customer-full-row,
.customer-full-table .customer-full-main,
.customer-full-table.is-recommend .customer-recommend-row,
.customer-list-actions,
.cert-auth-table-head,
.cert-auth-row,
.cert-auth-warning-list button {
  overflow: hidden;
}
.customer-preview-table button > *,
.customer-rank-row > *,
.customer-warning-list .customer-warning-row > *,
.customer-full-table .customer-full-head > *,
.customer-full-table .customer-full-main > *,
.customer-full-table.is-manage .customer-full-info-head > *,
.customer-full-table.is-manage .customer-full-head > span,
.customer-full-table.is-manage .customer-list-actions button,
.customer-full-table.is-recommend .customer-full-head > *,
.customer-full-table.is-recommend .customer-recommend-row > *,
.cert-auth-table-head > *,
.cert-auth-row > *,
.cert-auth-warning-list button > * {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-sizing: border-box;
}
.customer-full-table.is-recommend .customer-recommend-reason,
.cert-auth-row em,
.cert-auth-warning-list span,
.customer-warning-list .customer-warning-row span {
  display: block;
}
.customer-list-actions button,
.customer-full-table.is-recommend .customer-recommend-action-button {
  white-space: nowrap;
}

/* Customer 360 lower-row compact alignment */
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) {
    grid-template-rows: minmax(596px, auto) 492px;
  }
  .customer360-layout:not(.is-selected) .customer-risk-panel,
  .customer360-layout:not(.is-selected) .customer-warning-panel,
  .customer360-layout:not(.is-selected) .customer-score-panel {
    height: 492px;
    min-height: 492px;
    max-height: 492px;
    overflow: hidden;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard,
  .customer360-layout:not(.is-selected) .customer-warning-list,
  .customer360-layout:not(.is-selected) .customer-score-board {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
    max-height: none;
  }
  .customer360-layout:not(.is-selected) .customer-warning-list {
    padding: 7px 12px 16px;
    overflow: hidden;
    scrollbar-gutter: auto;
  }
  .customer360-layout:not(.is-selected) .customer-warning-scroll {
    height: 100%;
    max-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-gutter: stable;
  }
  .customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row {
    height: 48.9px;
    min-height: 48.9px;
    padding-top: 3px;
    padding-bottom: 3px;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard {
    gap: 7px;
    padding: 8px 14px 10px;
    grid-template-rows: auto auto minmax(0, 1fr);
    overflow: hidden;
  }
  .customer360-layout:not(.is-selected) .customer-risk-snapshot div {
    min-height: 50px;
    padding: 6px 10px;
  }
  .customer360-layout:not(.is-selected) .customer-risk-snapshot strong {
    font-size: 20px;
  }
  .customer360-layout:not(.is-selected) .customer-risk-pie-card {
    min-height: 94px;
    padding: 6px 10px;
  }
  .customer360-layout:not(.is-selected) .customer-risk-pie {
    width: 68px;
    height: 68px;
  }
  .customer360-layout:not(.is-selected) .customer-risk-pie::after {
    inset: 14px;
  }
  .customer360-layout:not(.is-selected) .customer-mini-chart,
  .customer360-layout:not(.is-selected) .customer-risk-matrix-mini {
    min-height: 100px;
    gap: 5px;
    padding: 6px;
  }
  .customer360-layout:not(.is-selected) .customer-risk-matrix-mini span {
    min-height: 32px;
  }
  .customer360-layout:not(.is-selected) .customer-score-board {
    gap: 7px;
    padding: 8px 14px 10px;
    overflow: hidden;
  }
  .customer360-layout:not(.is-selected) .customer-score-head {
    padding: 6px 12px;
  }
  .customer360-layout:not(.is-selected) .customer-score-cues div {
    min-height: 46px;
    padding: 6px;
  }
}

/* Customer 360 risk distribution chart-first redesign */
.customer-risk-dashboard.customer-risk-visual {
  display: grid;
  grid-template-rows: 42px 128px 62px 118px 44px;
  gap: 7px;
  padding: 8px 12px 10px;
  overflow: hidden;
}
.customer-risk-panel > .panel-header h3 {
  font-size: 18px;
  line-height: 20px;
  font-weight: 900;
}
.customer-risk-kpis {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 6px;
  min-height: 0;
}
.customer-risk-kpis div {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  grid-template-rows: auto auto;
  align-items: end;
  gap: 1px 4px;
  min-width: 0;
  padding: 5px 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfa;
}
.customer-risk-kpis div.high { border-color: #efc8c3; background: #fff7f5; }
.customer-risk-kpis div.medium { border-color: #ead5a8; background: #fffaf0; }
.customer-risk-kpis div.low { border-color: #c8e2d8; background: #f5fbf8; }
.customer-risk-kpis span,
.customer-risk-kpis em {
  min-width: 0;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  line-height: 1.05;
  white-space: nowrap;
}
.customer-risk-kpis strong {
  color: #143f45;
  font-size: 16px;
  line-height: 1;
  white-space: nowrap;
}
.customer-risk-kpis .high strong { color: var(--red); }
.customer-risk-kpis .medium strong { color: #94650d; }
.customer-risk-kpis .low strong { color: var(--green); }
.customer-risk-core {
  display: grid;
  grid-template-columns: minmax(132px,.9fr) minmax(0,1fr);
  gap: 7px;
  min-width: 0;
  min-height: 0;
}
.customer-risk-ring-card,
.customer-risk-level-list,
.customer-risk-list-card,
.customer-risk-driver-card,
.customer-risk-ai-strip {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}
.customer-risk-ring-card,
.customer-risk-level-list,
.customer-risk-list-card,
.customer-risk-driver-card {
  padding: 7px 8px;
}
.customer-risk-ring-card h4,
.customer-risk-level-list h4,
.customer-risk-card-title h4 {
  margin: 0;
  color: #173f46;
  font-size: 12px;
  line-height: 1.1;
}
.customer-risk-ring-row {
  display: grid;
  grid-template-columns: 74px minmax(0,1fr);
  align-items: center;
  gap: 7px;
  margin-top: 8px;
}
.customer-risk-visual .customer-risk-pie {
  width: 74px;
  height: 74px;
}
.customer-risk-visual .customer-risk-pie::after { inset: 15px; }
.customer-risk-visual .customer-risk-pie strong { font-size: 18px; }
.customer-risk-visual .customer-risk-pie span { font-size: 10px; }
.customer-risk-legend.compact {
  gap: 5px;
}
.customer-risk-legend.compact span {
  gap: 5px;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
}
.customer-risk-legend.compact i {
  width: 7px;
  height: 7px;
}
.customer-risk-level-list {
  display: grid;
  align-content: start;
  gap: 8px;
}
.customer-risk-level-list p {
  display: grid;
  grid-template-columns: 22px minmax(0,1fr) 20px;
  align-items: center;
  gap: 6px;
  margin: 0;
}
.customer-risk-level-list p span,
.customer-risk-level-list p strong {
  color: var(--muted-strong);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}
.customer-risk-level-list i {
  display: block;
  height: 8px;
  border-radius: 999px;
  background: #edf3f2;
  overflow: hidden;
}
.customer-risk-level-list b {
  display: block;
  height: 100%;
  border-radius: inherit;
}
.customer-risk-level-list b.high,
.customer-risk-driver-bars .high i { background: var(--red); }
.customer-risk-level-list b.medium,
.customer-risk-driver-bars .medium i { background: var(--amber); }
.customer-risk-level-list b.low { background: var(--green); }
.customer-risk-driver-bars .focus i { background: #6d3a86; }
.customer-risk-card-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.customer-risk-card-title span {
  min-width: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}
.customer-list-stack {
  display: flex;
  height: 18px;
  border-radius: 999px;
  background: #edf3f2;
  overflow: hidden;
}
.customer-list-stack span {
  display: grid;
  place-items: center;
  min-width: 0;
  color: #fff;
  overflow: hidden;
}
.customer-list-stack b {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px;
  line-height: 1;
}
.customer-list-stack .white { background: #17855b; }
.customer-list-stack .normal { background: #8da2a6; }
.customer-list-stack .focus { background: #8b6a17; }
.customer-list-stack .black { background: #4b1634; }
.customer-list-stack-legend {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 4px;
  margin-top: 6px;
}
.customer-list-stack-legend span {
  display: flex;
  align-items: center;
  gap: 3px;
  min-width: 0;
  color: var(--muted-strong);
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}
.customer-list-stack-legend i {
  flex: 0 0 auto;
  width: 6px;
  height: 6px;
  border-radius: 999px;
}
.customer-list-stack-legend b { margin-left: auto; color: #143f45; }
.customer-list-stack-legend .white i { background: #17855b; }
.customer-list-stack-legend .normal i { background: #8da2a6; }
.customer-list-stack-legend .focus i { background: #8b6a17; }
.customer-list-stack-legend .black i { background: #4b1634; }
.customer-risk-driver-card {
  display: grid;
  grid-template-rows: auto minmax(0,1fr);
}
.customer-risk-driver-bars {
  display: grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  align-items: end;
  gap: 7px;
  min-height: 0;
  padding-top: 2px;
}
.customer-risk-driver-bars div {
  display: grid;
  grid-template-rows: 14px minmax(0,1fr) 14px;
  justify-items: center;
  gap: 3px;
  height: 100%;
  min-width: 0;
}
.customer-risk-driver-bars span,
.customer-risk-driver-bars b {
  color: var(--muted-strong);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}
.customer-risk-driver-bars i {
  align-self: end;
  width: 18px;
  min-height: 12px;
  border-radius: 8px 8px 3px 3px;
  box-shadow: inset 0 -8px 0 rgba(255,255,255,.12);
}
.customer-risk-ai-strip {
  display: grid;
  align-content: center;
  gap: 3px;
  padding: 7px 9px;
  border-left: 4px solid var(--brand);
  background: #f5faf8;
}
.customer-risk-ai-strip p {
  margin: 0;
  overflow: hidden;
  color: #173f46;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: 42px 128px 62px 118px 44px;
    gap: 7px;
    padding: 8px 12px 10px;
  }
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: 40px 124px 60px 116px 42px;
    gap: 6px;
    padding-inline: 10px;
  }
  .customer-risk-core {
    grid-template-columns: minmax(124px,.86fr) minmax(0,1fr);
  }
  .customer-risk-ring-row {
    grid-template-columns: 66px minmax(0,1fr);
    gap: 6px;
  }
  .customer-risk-visual .customer-risk-pie {
    width: 66px;
    height: 66px;
  }
  .customer-risk-visual .customer-risk-pie::after { inset: 13px; }
  .customer-list-stack-legend span { font-size: 9px; }
}
@media (max-width: 1180px) {
  .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: auto;
  }
  .customer-risk-core {
    grid-template-columns: 1fr;
  }
}
/* Customer 360 risk distribution polish: remove level bars and refine chart look */
.customer-risk-dashboard.customer-risk-visual {
  grid-template-rows: 42px 132px 62px 118px 44px;
}
.customer-risk-kpis div {
  align-items: center;
  padding: 6px 8px;
  border-color: #d9e6e3;
  border-left-width: 3px;
  background: #fbfdfc;
}
.customer-risk-kpis div.high { border-color: #ead4cf; border-left-color: #b94a3a; background: #fff9f7; }
.customer-risk-kpis div.medium { border-color: #eadfca; border-left-color: #b88422; background: #fffdf6; }
.customer-risk-kpis div.low { border-color: #d2e5dc; border-left-color: #17855b; background: #f8fcfa; }
.customer-risk-kpis span {
  color: #476367;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
}
.customer-risk-kpis strong {
  color: #153f46;
  font-size: 17px;
  font-weight: 900;
}
.customer-risk-kpis em {
  color: #6d7f82;
  font-size: 10px;
  font-weight: 800;
  text-align: right;
}
.customer-risk-core {
  grid-template-columns: 1fr;
}
.customer-risk-ring-card {
  display: grid;
  grid-template-rows: auto minmax(0,1fr);
  padding: 8px 10px;
}
.customer-risk-ring-card .customer-risk-card-title {
  margin-bottom: 4px;
}
.customer-risk-ring-row {
  grid-template-columns: 98px minmax(0,1fr);
  gap: 12px;
  margin-top: 0;
  align-items: center;
}
.customer-risk-visual .customer-risk-pie {
  width: 92px;
  height: 92px;
}
.customer-risk-visual .customer-risk-pie::after {
  inset: 18px;
  box-shadow: inset 0 0 0 1px #e0ece9;
}
.customer-risk-visual .customer-risk-pie strong {
  color: #123b42;
  font-size: 22px;
  font-weight: 900;
}
.customer-risk-visual .customer-risk-pie span {
  color: #6a7d80;
  font-size: 11px;
  font-weight: 800;
}
.customer-risk-legend.compact {
  gap: 7px;
}
.customer-risk-legend.compact span {
  display: grid;
  grid-template-columns: 8px 48px minmax(0,1fr);
  gap: 7px;
  align-items: center;
  color: #355b61;
  font-size: 11px;
  font-weight: 800;
}
.customer-risk-legend.compact em {
  color: #476367;
  font-style: normal;
  white-space: nowrap;
}
.customer-risk-legend.compact b {
  justify-self: end;
  color: #173f46;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.customer-risk-card-title h4 {
  color: #123b42;
  font-size: 13px;
  font-weight: 900;
}
.customer-risk-card-title span {
  color: #6d7f82;
  font-size: 11px;
  font-weight: 800;
}
.customer-list-stack {
  height: 17px;
  border-radius: 4px;
}
.customer-list-stack span {
  border-right: 1px solid rgba(255,255,255,.55);
}
.customer-list-stack span:last-child {
  border-right: 0;
}
.customer-list-stack b {
  font-size: 10px;
  font-weight: 900;
}
.customer-list-stack-legend span {
  color: #476367;
  font-size: 10px;
}
.customer-risk-driver-card {
  padding-bottom: 8px;
}
.customer-risk-driver-bars {
  gap: 8px;
  padding: 3px 4px 0;
}
.customer-risk-driver-bars div {
  grid-template-rows: 16px minmax(0,1fr) 14px;
  gap: 4px;
}
.customer-risk-driver-bars span {
  color: #173f46;
  font-size: 12px;
  font-weight: 900;
}
.customer-risk-driver-bars b {
  color: #536b70;
  font-size: 11px;
  font-weight: 800;
}
.customer-risk-driver-bars i {
  width: 20px;
  min-height: 10px;
  border-radius: 2px 2px 1px 1px;
  box-shadow: none;
}
.customer-risk-driver-bars .high i { background: #b94a3a; }
.customer-risk-driver-bars .medium i { background: #b88422; }
.customer-risk-driver-bars .focus i { background: #6d3a86; }
.customer-risk-ai-strip {
  border-left-color: #0f766e;
  background: #f7fbfa;
}
.customer-risk-ai-strip p {
  color: #244b51;
  font-size: 11px;
  font-weight: 800;
}
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: 42px 132px 62px 118px 44px;
  }
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: 40px 128px 60px 116px 42px;
  }
  .customer-risk-ring-row {
    grid-template-columns: 84px minmax(0,1fr);
    gap: 9px;
  }
  .customer-risk-visual .customer-risk-pie {
    width: 78px;
    height: 78px;
  }
  .customer-risk-visual .customer-risk-pie::after { inset: 16px; }
  .customer-risk-legend.compact span {
    grid-template-columns: 8px 42px minmax(0,1fr);
    gap: 5px;
  }
  .customer-risk-legend.compact b {
    font-size: 11px;
  }
}

/* Customer 360 risk distribution final layout refinement */
.customer-risk-dashboard.customer-risk-visual {
  grid-template-rows: 42px 148px 84px 138px;
  gap: 7px;
  padding: 8px 12px 10px;
}
.customer-risk-kpis div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  padding: 6px 7px;
}
.customer-risk-kpis span,
.customer-risk-kpis strong,
.customer-risk-kpis em {
  line-height: 1;
  white-space: nowrap;
  -webkit-font-smoothing: antialiased;
}
.customer-risk-kpis span {
  color: #3f5b60;
  font-size: 11px;
  font-weight: 600;
}
.customer-risk-kpis strong {
  font-size: 15px;
  font-weight: 700;
}
.customer-risk-kpis em {
  color: #6a7c80;
  font-size: 10px;
  font-weight: 500;
}
.customer-risk-ring-card {
  padding: 9px 10px;
}
.customer-risk-ring-row {
  grid-template-columns: 122px minmax(0,1fr);
  gap: 12px;
  height: 100%;
}
.customer-risk-visual .customer-risk-pie {
  width: 104px;
  height: 104px;
  border: 1px solid #d8e7e4;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
}
.customer-risk-visual .customer-risk-pie::after {
  display: none;
}
.customer-risk-visual .customer-risk-pie strong,
.customer-risk-visual .customer-risk-pie span {
  justify-self: center;
  align-self: center;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  color: #173f46;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 1px 4px rgba(16,48,52,.1);
}
.customer-risk-visual .customer-risk-pie strong {
  margin-bottom: 17px;
  font-size: 18px;
}
.customer-risk-visual .customer-risk-pie span {
  margin-top: 22px;
  color: #526b70;
  font-size: 10px;
  font-weight: 500;
}
.customer-risk-legend.compact {
  align-content: center;
  gap: 9px;
}
.customer-risk-legend.compact span {
  grid-template-columns: 9px 50px minmax(0,1fr);
  gap: 7px;
  min-height: 24px;
  padding: 3px 6px;
  border: 1px solid #e4eeee;
  border-radius: 5px;
  background: #fbfdfc;
  color: #355b61;
  font-size: 12px;
  font-weight: 500;
}
.customer-risk-legend.compact i {
  width: 8px;
  height: 8px;
}
.customer-risk-legend.compact em {
  color: #3f5b60;
  font-size: 12px;
  font-weight: 500;
}
.customer-risk-legend.compact b {
  color: #173f46;
  font-size: 12px;
  font-weight: 600;
}
.customer-risk-card-title h4 {
  color: #123b42;
  font-size: 13px;
  font-weight: 700;
}
.customer-risk-card-title span {
  color: #667b7f;
  font-size: 11px;
  font-weight: 500;
}
.customer-risk-list-card {
  padding: 9px 10px;
}
.customer-list-stack {
  height: 26px;
  border-radius: 5px;
}
.customer-list-stack b {
  font-size: 11px;
  font-weight: 600;
}
.customer-list-stack-legend {
  margin-top: 8px;
}
.customer-list-stack-legend span {
  color: #3f5b60;
  font-size: 11px;
  font-weight: 500;
}
.customer-list-stack-legend b {
  font-weight: 600;
}
.customer-risk-driver-card {
  padding: 9px 10px 10px;
}
.customer-risk-driver-bars {
  gap: 10px;
  padding: 5px 6px 0;
}
.customer-risk-driver-bars div {
  grid-template-rows: 17px minmax(0,1fr) 15px;
  gap: 4px;
}
.customer-risk-driver-bars span {
  color: #173f46;
  font-size: 12px;
  font-weight: 600;
}
.customer-risk-driver-bars b {
  color: #50696e;
  font-size: 11px;
  font-weight: 500;
}
.customer-risk-driver-bars i {
  width: 22px;
  border-radius: 2px 2px 1px 1px;
}
.customer-risk-driver-bars .driver-cert i { background: #2f6f9f; }
.customer-risk-driver-bars .driver-auth i { background: #8a5a12; }
.customer-risk-driver-bars .driver-performance i { background: #7b5aa6; }
.customer-risk-driver-bars .driver-amount i { background: #b45b4f; }
.customer-risk-driver-bars .driver-list i { background: #2f7d7a; }
.customer-risk-driver-bars .driver-cert span { color: #245a83; }
.customer-risk-driver-bars .driver-auth span { color: #7a5010; }
.customer-risk-driver-bars .driver-performance span { color: #65498d; }
.customer-risk-driver-bars .driver-amount span { color: #97473f; }
.customer-risk-driver-bars .driver-list span { color: #256967; }
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: 42px 148px 84px 138px;
  }
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: 40px 140px 82px 132px;
    gap: 6px;
  }
  .customer-risk-ring-row {
    grid-template-columns: 104px minmax(0,1fr);
    gap: 10px;
  }
  .customer-risk-visual .customer-risk-pie {
    width: 88px;
    height: 88px;
  }
  .customer-risk-visual .customer-risk-pie strong {
    font-size: 16px;
  }
  .customer-risk-legend.compact span {
    grid-template-columns: 8px 44px minmax(0,1fr);
    gap: 5px;
    padding-inline: 5px;
    font-size: 11px;
  }
  .customer-risk-legend.compact em,
  .customer-risk-legend.compact b {
    font-size: 11px;
  }
}

/* Customer 360 final pie size override */
.customer360-layout:not(.is-selected) .customer-risk-visual .customer-risk-ring-row {
  grid-template-columns: 132px minmax(0,1fr);
  gap: 10px;
}
.customer360-layout:not(.is-selected) .customer-risk-visual .customer-risk-pie {
  width: 124px !important;
  height: 124px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-visual .customer-risk-pie strong {
  margin-bottom: 20px;
  font-size: 20px;
}
.customer360-layout:not(.is-selected) .customer-risk-visual .customer-risk-pie span {
  margin-top: 24px;
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-risk-visual .customer-risk-ring-row {
    grid-template-columns: 116px minmax(0,1fr);
    gap: 8px;
  }
  .customer360-layout:not(.is-selected) .customer-risk-visual .customer-risk-pie {
    width: 108px !important;
    height: 108px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-visual .customer-risk-pie strong {
    margin-bottom: 18px;
    font-size: 18px;
  }
  .customer360-layout:not(.is-selected) .customer-risk-visual .customer-risk-pie span {
    margin-top: 22px;
  }
}

/* Customer 360 list stack colors match status badges */
.customer-list-stack span {
  box-sizing: border-box;
  border-right: 1px solid rgba(255,255,255,.72);
}
.customer-list-stack .white {
  background: #edf6ff;
  box-shadow: inset 0 0 0 1px #b9d6f2;
}
.customer-list-stack .focus {
  background: #f1f0ff;
  box-shadow: inset 0 0 0 1px #c8c7f5;
}
.customer-list-stack .black {
  background: #4b1634;
  box-shadow: inset 0 0 0 1px #4b1634;
}
.customer-list-stack .normal {
  background: #f6f8fb;
  box-shadow: inset 0 0 0 1px #d8e0e7;
}
.customer-list-stack-legend span.white { color: #075a9b; }
.customer-list-stack-legend span.focus { color: #4b4ab8; }
.customer-list-stack-legend span.black { color: #4b1634; }
.customer-list-stack-legend span.normal { color: #4b5d67; }
.customer-list-stack-legend .white i {
  background: #edf6ff;
  border: 1px solid #b9d6f2;
}
.customer-list-stack-legend .focus i {
  background: #f1f0ff;
  border: 1px solid #c8c7f5;
}
.customer-list-stack-legend .black i {
  background: #4b1634;
  border: 1px solid #4b1634;
}
.customer-list-stack-legend .normal i {
  background: #f6f8fb;
  border: 1px solid #d8e0e7;
}

/* Customer 360 risk distribution: three-part visual structure */
.customer-risk-dashboard.customer-risk-visual {
  display: grid;
  grid-template-rows: minmax(136px, 1fr) 78px minmax(124px, .92fr) !important;
  gap: 8px;
  height: 100%;
  padding: 9px 12px 10px;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-ring-card,
.customer-risk-dashboard.customer-risk-visual .customer-risk-list-card,
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-card {
  min-height: 0;
  padding: 9px 10px;
  border: 1px solid #d9e6e4;
  border-radius: 8px;
  background: #fff;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-card-title {
  display: flex;
  align-items: center;
  min-height: 18px;
  margin: 0 0 7px;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-card-title h4 {
  margin: 0;
  color: #123b42;
  font-size: 13px;
  font-weight: 750;
  line-height: 1;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-card-title span {
  display: none;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-ring-row {
  display: grid;
  grid-template-columns: 136px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  height: calc(100% - 25px);
  min-height: 0;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-pie {
  display: grid;
  place-items: center;
  width: 126px !important;
  height: 126px !important;
  margin: 0 auto;
  border: 1px solid #cfdddd;
  border-radius: 999px;
  background: var(--customer-risk-pie);
  box-shadow: none;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-pie::after,
.customer-risk-dashboard.customer-risk-visual .customer-risk-pie span {
  display: none !important;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-pie strong {
  display: block;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #143f45;
  font-size: 25px;
  font-weight: 780;
  line-height: 1;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact {
  display: grid;
  align-content: center;
  gap: 8px;
  min-width: 0;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact span {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 25px;
  padding: 4px 7px;
  border: 1px solid #e3eeee;
  border-radius: 6px;
  background: #fbfdfc;
  color: #334f55;
  font-size: 12px;
  font-weight: 600;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact i {
  width: 9px;
  height: 9px;
  border-radius: 999px;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact em {
  min-width: 0;
  overflow: hidden;
  color: #334f55;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact b {
  color: #123b42;
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact .high i { background: #b3261e; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact .medium i { background: #b88422; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact .low i { background: #17855b; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack {
  display: flex;
  width: 100%;
  height: 12px;
  overflow: hidden;
  border: 1px solid #d6e3e0;
  border-radius: 999px;
  background: #eef4f3;
}
.customer-risk-dashboard.customer-risk-visual .customer-list-stack span {
  min-width: 0;
  border-right: 1px solid rgba(255,255,255,.75);
  box-shadow: none;
}
.customer-risk-dashboard.customer-risk-visual .customer-list-stack span:last-child { border-right: 0; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack .white { background: #0b73b7; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack .normal { background: #60757b; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack .focus { background: #6554c0; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack .black { background: #4b1634; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin-top: 9px;
}
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend span {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  align-items: center;
  gap: 5px;
  min-width: 0;
  color: #405b60;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend i {
  width: 8px;
  height: 8px;
  border: 0;
  border-radius: 999px;
}
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend b {
  color: #123b42;
  font-size: 11px;
  font-weight: 750;
}
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend .white i { background: #0b73b7; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend .normal i { background: #60757b; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend .focus i { background: #6554c0; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend .black i { background: #4b1634; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend span.white { color: #0b5f96; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend span.normal { color: #52666b; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend span.focus { color: #5142a7; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend span.black { color: #4b1634; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: end;
  gap: 10px;
  height: calc(100% - 25px);
  min-height: 0;
  padding: 3px 4px 0;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
  display: grid;
  grid-template-rows: 18px minmax(34px, 1fr) 16px;
  justify-items: center;
  gap: 4px;
  min-width: 0;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars span {
  color: #123b42;
  font-size: 12px;
  font-weight: 750;
  line-height: 1;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i {
  align-self: end;
  width: 23px;
  min-height: 12px;
  border-radius: 2px 2px 1px 1px;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars b {
  overflow: hidden;
  max-width: 100%;
  color: #465f64;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-cert i { background: #2563eb; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-auth i { background: #0f766e; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-performance i { background: #7c3aed; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-amount i { background: #db2777; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-list i { background: #ea580c; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-cert span,
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-cert b { color: #1d4ed8; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-auth span,
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-auth b { color: #0f766e; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-performance span,
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-performance b { color: #6d28d9; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-amount span,
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-amount b { color: #be185d; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-list span,
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars .driver-list b { color: #c2410c; }
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: minmax(124px, 1fr) 72px minmax(118px, .88fr) !important;
    gap: 7px;
  }
  .customer-risk-dashboard.customer-risk-visual .customer-risk-ring-row {
    grid-template-columns: 116px minmax(0, 1fr);
    gap: 10px;
  }
  .customer-risk-dashboard.customer-risk-visual .customer-risk-pie {
    width: 108px !important;
    height: 108px !important;
  }
  .customer-risk-dashboard.customer-risk-visual .customer-risk-pie strong {
    font-size: 22px;
  }
  .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact span {
    min-height: 23px;
    padding-inline: 6px;
  }
}
/* Customer 360 risk distribution axis and count refinements */
.customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact span {
  grid-template-columns: 10px minmax(0, 1fr) 72px;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact b {
  text-align: right;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-list-card {
  padding-top: 10px;
}
.customer-risk-dashboard.customer-risk-visual .customer-list-stack {
  height: 18px;
  margin-top: 8px;
  border-color: #c9d8d5;
}
.customer-risk-dashboard.customer-risk-visual .customer-list-stack span {
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  text-shadow: 0 1px 2px rgba(0,0,0,.18);
}
.customer-risk-dashboard.customer-risk-visual .customer-list-stack .white { background: #075f9f; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack .normal { background: #52666d; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack .focus { background: #5741ad; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack .black { background: #41112d; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend {
  margin-top: 10px;
}
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend .white i { background: #075f9f; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend .normal i { background: #52666d; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend .focus i { background: #5741ad; }
.customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend .black i { background: #41112d; }
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-card {
  padding-bottom: 9px;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-chart {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 7px;
  height: calc(100% - 25px);
  min-height: 0;
  padding-top: 8px;
}
.customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis {
  display: grid;
  grid-template-rows: 14px 1fr 1fr 14px;
  align-items: center;
  justify-items: end;
  min-width: 0;
  color: #6b7f83;
  font-size: 10px;
  font-weight: 650;
  line-height: 1;
}
.customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis span {
  color: #425f65;
  font-size: 10px;
  font-weight: 750;
}
.customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis b {
  color: #76898d;
  font-size: 10px;
  font-weight: 650;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot {
  position: relative;
  min-width: 0;
  min-height: 0;
  padding: 8px 4px 0 8px;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 8px;
  bottom: 17px;
  border-left: 1px solid #c8d7d4;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot::after {
  content: "";
  position: absolute;
  left: 8px;
  right: 4px;
  bottom: 17px;
  border-bottom: 1px solid #c8d7d4;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: end;
  gap: 10px;
  height: 100%;
  min-height: 0;
  padding: 0 0 0 8px;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
  display: grid;
  grid-template-rows: 16px minmax(30px, 1fr) 17px;
  justify-items: center;
  gap: 3px;
  min-width: 0;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars span {
  font-size: 11px;
  line-height: 1;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i {
  align-self: end;
  width: 22px;
  min-height: 10px;
  border-radius: 2px 2px 0 0;
}
.customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars b {
  align-self: end;
  font-size: 10px;
  line-height: 1;
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact span {
    grid-template-columns: 9px minmax(0, 1fr) 64px;
  }
  .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-chart {
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 6px;
    padding-top: 6px;
  }
  .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars {
    gap: 8px;
  }
  .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i {
    width: 20px;
  }
}
/* Customer 360 risk distribution typography aligned with adjacent warning panels */
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
  padding-top: 7px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-ring-card,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-list-card,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-card {
  padding: 8px 10px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-card-title {
  min-height: 18px;
  margin-bottom: 9px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-card-title h4 {
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-ring-row {
  height: calc(100% - 30px);
  align-items: center;
  padding-top: 2px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie strong {
  color: var(--text);
  font-size: 23px;
  font-weight: 800;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact span,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend span,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars b,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis span,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis b {
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.25;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact em,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact b {
  font-size: 12px;
  font-weight: 700;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact span {
  min-height: 26px;
  border-color: var(--line);
  background: #fff;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack {
  margin-top: 11px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack span {
  font-size: 11px;
  font-weight: 800;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-chart {
  height: calc(100% - 30px);
  padding-top: 12px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot {
  padding-top: 12px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot::before {
  top: 12px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot::after {
  bottom: 18px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars {
  padding-left: 8px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
  grid-template-rows: 16px minmax(28px, 1fr) 18px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars span {
  font-size: 12px;
  font-weight: 800;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars b {
  color: var(--muted-strong);
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-card-title {
    margin-bottom: 7px;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie strong {
    font-size: 21px;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact span,
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend span,
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars b,
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis span,
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis b {
    font-size: 11px;
  }
}
/* Customer 360 certificate warning side color follows risk level, matching ranking rows */
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row.high,
.customer-warning-list button.high {
  border-left-color: var(--red);
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row.medium,
.customer-warning-list button.medium {
  border-left-color: var(--amber);
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row.low,
.customer-warning-list button.low {
  border-left-color: var(--green);
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row.high:hover {
  border-left-color: var(--red);
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row.medium:hover {
  border-left-color: var(--amber);
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row.low:hover {
  border-left-color: var(--green);
}
/* Customer 360 risk distribution final cleanup: empty pie, legend-only list, taller source chart */
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
  grid-template-rows: minmax(126px, .9fr) 76px minmax(176px, 1.2fr) !important;
  gap: 9px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie {
  color: transparent;
  font-size: 0;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie > * {
  display: none !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 8px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend span {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-width: 0;
  overflow: hidden;
  padding: 0 1px;
  font-size: 11px;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend b {
  display: none !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack {
  height: 20px;
  margin-top: 12px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-card {
  padding-top: 8px;
  padding-bottom: 10px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-chart {
  height: calc(100% - 28px);
  padding-top: 16px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot {
  padding-top: 14px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot::before {
  top: 14px;
  bottom: 18px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot::after {
  bottom: 18px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
  grid-template-rows: 16px minmax(72px, 1fr) 18px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i {
  min-height: 18px;
  width: 24px;
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: minmax(116px, .82fr) 74px minmax(160px, 1.18fr) !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
    grid-template-rows: 15px minmax(62px, 1fr) 17px;
  }
}

/* Customer 360 certificate warning rows match ranking risk tint and side strip */
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row.high {
  border-left-color: var(--red);
  background: #fff7f5;
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row.medium {
  border-left-color: var(--amber);
  background: #fffaf0;
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row.low {
  border-left-color: var(--green);
  background: #f5fbf8;
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row.high:hover {
  border-color: var(--brand);
  border-left-color: var(--red);
  background: #fff1ef;
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row.medium:hover {
  border-color: var(--brand);
  border-left-color: var(--amber);
  background: #fff7e3;
}
.customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row.low:hover {
  border-color: var(--brand);
  border-left-color: var(--green);
  background: #e9f6ef;
}
/* Customer 360 risk panel typography and vertical rhythm matched to warning panel */
.customer360-layout:not(.is-selected) .customer-risk-panel > .panel-header h3 {
  color: var(--text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
  margin-top: 10px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-card-title h4 {
  color: var(--text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: normal !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact span {
  color: var(--muted-strong) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact em {
  color: var(--muted-strong) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact b {
  color: var(--text) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend span,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars b,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis span,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis b {
  color: var(--muted-strong) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars span {
  color: var(--text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: normal !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack span {
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-risk-panel > .panel-header h3 {
    font-size: 16px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact span,
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend span,
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars b,
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis span,
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis b {
    font-size: 12px !important;
  }
}
/* Align Customer Risk Distribution panel title baseline with adjacent lower-row panels */
.customer360-layout:not(.is-selected) .customer-risk-panel > .panel-header > div {
  transform: translateY(5px);
}
/* Customer 360 risk panel final layout repair: no clipping and aligned axes */
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
  grid-template-rows: 148px 86px minmax(180px, 1fr) !important;
  gap: 9px !important;
  overflow: hidden;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-ring-card,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-list-card,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-card {
  overflow: hidden;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-ring-row {
  grid-template-columns: 112px minmax(0, 1fr) !important;
  gap: 10px !important;
  height: calc(100% - 26px) !important;
  padding-top: 0 !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie {
  width: 100px !important;
  height: 100px !important;
  align-self: center;
  justify-self: center;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact {
  align-content: center !important;
  gap: 6px !important;
  height: 100%;
  overflow: hidden;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-legend.compact span {
  min-height: 24px !important;
  height: 24px !important;
  padding: 3px 6px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-list-card {
  display: grid;
  grid-template-rows: 18px 22px 20px;
  gap: 8px;
  align-content: start;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-list-card .customer-risk-card-title {
  margin: 0 !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack {
  align-self: center;
  height: 20px !important;
  margin: 0 !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend {
  align-self: center;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 5px !important;
  margin: 0 !important;
  overflow: hidden;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-list-stack-legend span {
  justify-content: center;
  min-width: 0;
  height: 18px;
  overflow: hidden;
  font-size: 11px !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-card {
  display: grid;
  grid-template-rows: 18px minmax(0, 1fr);
  gap: 8px;
  padding-bottom: 10px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-card .customer-risk-card-title {
  margin: 0 !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-chart {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) !important;
  gap: 6px !important;
  height: 100% !important;
  min-height: 0;
  padding-top: 10px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis {
  display: grid !important;
  place-items: start center;
  grid-template-rows: none !important;
  padding-top: 0;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis b {
  display: none !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis span {
  writing-mode: vertical-rl;
  letter-spacing: 1px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot {
  position: relative;
  min-height: 0;
  padding: 0 2px 0 4px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot::before {
  left: 4px !important;
  top: 0 !important;
  bottom: 20px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot::after {
  left: 4px !important;
  right: 2px !important;
  bottom: 20px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars {
  height: 100% !important;
  padding: 0 0 0 4px !important;
  gap: 8px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
  grid-template-rows: 16px minmax(92px, 1fr) 20px !important;
  gap: 3px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i {
  width: 22px !important;
  min-height: 18px !important;
  justify-self: center;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars b {
  justify-self: center;
  text-align: center;
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: 140px 84px minmax(170px, 1fr) !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-ring-row {
    grid-template-columns: 102px minmax(0, 1fr) !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie {
    width: 92px !important;
    height: 92px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
    grid-template-rows: 15px minmax(82px, 1fr) 19px !important;
  }
}
/* Customer 360 lower row height expansion for readable risk charts */
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) {
    grid-template-rows: minmax(596px, auto) 560px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-panel,
  .customer360-layout:not(.is-selected) .customer-warning-panel,
  .customer360-layout:not(.is-selected) .customer-score-panel {
    height: 560px !important;
    min-height: 560px !important;
    max-height: 560px !important;
  }
  .customer360-layout:not(.is-selected) .customer-warning-list,
  .customer360-layout:not(.is-selected) .customer-score-board {
    height: auto !important;
    min-height: 0 !important;
  }
  .customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row {
    height: 57.4px !important;
    min-height: 57.4px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: 160px 92px minmax(218px, 1fr) !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie {
    width: 108px !important;
    height: 108px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
    grid-template-rows: 16px minmax(118px, 1fr) 20px !important;
  }
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer360-layout:not(.is-selected) {
    grid-template-rows: minmax(596px, auto) 540px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-panel,
  .customer360-layout:not(.is-selected) .customer-warning-panel,
  .customer360-layout:not(.is-selected) .customer-score-panel {
    height: 540px !important;
    min-height: 540px !important;
    max-height: 540px !important;
  }
  .customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row {
    height: 54.9px !important;
    min-height: 54.9px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: 154px 90px minmax(205px, 1fr) !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie {
    width: 102px !important;
    height: 102px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
    grid-template-rows: 15px minmax(110px, 1fr) 19px !important;
  }
}
/* Customer 360 risk source chart: no y-axis label, bars sit on axes */
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-chart {
  grid-template-columns: 6px minmax(0, 1fr) !important;
  gap: 4px !important;
  padding-top: 8px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis {
  display: block !important;
  width: 6px;
  padding: 0;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis span,
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-driver-y-axis b {
  display: none !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot {
  padding: 0 4px 0 0 !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot::before {
  left: 0 !important;
  top: 0 !important;
  bottom: 20px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot::after {
  left: 0 !important;
  right: 4px !important;
  bottom: 20px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars {
  padding: 0 !important;
  gap: 8px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
  grid-template-rows: 18px minmax(118px, 1fr) 20px !important;
  gap: 0 !important;
  align-items: end;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars span {
  align-self: end;
  margin-bottom: 4px;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i {
  align-self: end;
  margin: 0;
  border-radius: 2px 2px 0 0;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars b {
  align-self: center;
  line-height: 20px !important;
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
    grid-template-rows: 17px minmax(108px, 1fr) 20px !important;
  }
}
/* Customer 360 risk source chart: value labels follow each bar height */
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot::before {
  bottom: 24px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-plot::after {
  bottom: 24px !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 4px !important;
  height: 100%;
  min-height: 0;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars span {
  flex: 0 0 auto;
  margin: 0 !important;
  line-height: 1 !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i {
  flex: 0 0 auto;
  align-self: center !important;
  margin: 0 !important;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars b {
  flex: 0 0 20px;
  align-self: stretch !important;
  display: grid;
  place-items: center;
  line-height: 1 !important;
}
/* Center risk-source value labels above their own bars */
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars span {
  align-self: center !important;
  justify-self: center !important;
  width: auto !important;
  min-width: 0 !important;
  text-align: center !important;
}
/* Customer 360 risk chart motion */
@property --customer-risk-pie-progress {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 0%;
}
@keyframes customerRiskPieReveal {
  from { --customer-risk-pie-progress: 0%; }
  to { --customer-risk-pie-progress: 100%; }
}
@keyframes customerRiskPieSettle {
  0% { transform: scale(.96); filter: saturate(.9); }
  70% { transform: scale(1.015); filter: saturate(1.05); }
  100% { transform: scale(1); filter: saturate(1); }
}
@keyframes customerRiskBarGrow {
  from { transform: scaleY(0); opacity: .65; }
  to { transform: scaleY(1); opacity: 1; }
}
@keyframes customerRiskValueIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie {
  position: relative;
  overflow: hidden;
  animation: customerRiskPieSettle 820ms cubic-bezier(.22,.9,.25,1) both;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie::before {
  content: "";
  position: absolute;
  inset: -1px;
  z-index: 1;
  border-radius: inherit;
  background: conic-gradient(transparent 0 var(--customer-risk-pie-progress), rgba(255,255,255,.96) var(--customer-risk-pie-progress) 100%);
  pointer-events: none;
  animation: customerRiskPieReveal 920ms cubic-bezier(.2,.82,.22,1) forwards;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i {
  transform-origin: center bottom;
  animation: customerRiskBarGrow 760ms cubic-bezier(.18,.78,.22,1) both;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars span {
  opacity: 0;
  animation: customerRiskValueIn 420ms ease-out forwards;
}
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div:nth-child(1) i { animation-delay: 80ms; }
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div:nth-child(2) i { animation-delay: 150ms; }
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div:nth-child(3) i { animation-delay: 220ms; }
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div:nth-child(4) i { animation-delay: 290ms; }
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div:nth-child(5) i { animation-delay: 360ms; }
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div:nth-child(1) span { animation-delay: 420ms; }
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div:nth-child(2) span { animation-delay: 490ms; }
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div:nth-child(3) span { animation-delay: 560ms; }
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div:nth-child(4) span { animation-delay: 630ms; }
.customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div:nth-child(5) span { animation-delay: 700ms; }
@media (prefers-reduced-motion: reduce) {
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie,
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie::before,
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i,
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars span {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-pie::before {
    display: none !important;
  }
}
/* Customer 360 risk source chart height moderation */
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) {
    grid-template-rows: minmax(596px, auto) 520px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-panel,
  .customer360-layout:not(.is-selected) .customer-warning-panel,
  .customer360-layout:not(.is-selected) .customer-score-panel {
    height: 520px !important;
    min-height: 520px !important;
    max-height: 520px !important;
  }
  .customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row {
    height: 52.4px !important;
    min-height: 52.4px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: 154px 88px minmax(176px, 1fr) !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars div {
    min-height: 0;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i {
    max-height: 118px;
  }
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer360-layout:not(.is-selected) {
    grid-template-rows: minmax(596px, auto) 505px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-panel,
  .customer360-layout:not(.is-selected) .customer-warning-panel,
  .customer360-layout:not(.is-selected) .customer-score-panel {
    height: 505px !important;
    min-height: 505px !important;
    max-height: 505px !important;
  }
  .customer360-layout:not(.is-selected) .customer-warning-list .customer-warning-row {
    height: 50.5px !important;
    min-height: 50.5px !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual {
    grid-template-rows: 148px 86px minmax(164px, 1fr) !important;
  }
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i {
    max-height: 104px;
  }
}
/* Customer 360 risk source chart final compact height */
@media (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i {
    max-height: 92px !important;
  }
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer360-layout:not(.is-selected) .customer-risk-dashboard.customer-risk-visual .customer-risk-driver-bars i {
    max-height: 84px !important;
  }
}
/* Customer 360 performance evaluation: conclusion-first compact board */
.customer-performance-board {
  display: grid;
  grid-template-rows: 82px 132px 48px minmax(0, 1fr) !important;
  gap: 7px !important;
  padding: 8px 14px 10px !important;
  overflow: hidden !important;
}
.customer-performance-summary {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
  min-height: 0;
  padding: 9px 10px;
  border: 1px solid #d7e5e1;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #f7faf8;
}
.customer-performance-summary.good { border-left-color: #16847a; background: #f5fbf8; }
.customer-performance-summary.excellent { border-left-color: #0b7d55; background: #f4fbf6; }
.customer-performance-summary.watch { border-left-color: #c27b17; background: #fffbf2; }
.customer-performance-summary.risk { border-left-color: #b6413a; background: #fff7f6; }
.customer-performance-summary.empty { border-left-color: #789096; background: #f8fafb; }
.customer-performance-summary div {
  display: grid;
  align-content: center;
  gap: 3px;
  min-width: 0;
}
.customer-performance-summary span,
.customer-performance-title span,
.customer-performance-alerts span,
.customer-performance-dimensions span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.25;
}
.customer-performance-summary strong {
  color: var(--brand);
  font-size: 24px;
  line-height: 1;
}
.customer-performance-summary.watch strong { color: #a86611; }
.customer-performance-summary.risk strong { color: #a73532; }
.customer-performance-summary em {
  color: #46636a;
  font-size: 12px;
  font-style: normal;
  font-weight: 750;
}
.customer-performance-summary p {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  color: #1f3f46;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.customer-performance-dimensions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  min-height: 0;
}
.customer-performance-dimensions article {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) 5px;
  gap: 4px;
  min-width: 0;
  min-height: 0;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-left: 3px solid #8aa2a6;
  border-radius: 8px;
  background: #fff;
}
.customer-performance-dimensions article.good,
.customer-performance-dimensions article.excellent { border-left-color: #16847a; background: #fbfefd; }
.customer-performance-dimensions article.watch { border-left-color: #c27b17; background: #fffdf7; }
.customer-performance-dimensions article.risk { border-left-color: #b6413a; background: #fffafa; }
.customer-performance-dimensions article div {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.customer-performance-dimensions strong {
  overflow: hidden;
  color: #123b42;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-performance-dimensions b {
  margin-left: auto;
  color: var(--brand);
  font-size: 16px;
  line-height: 1;
}
.customer-performance-dimensions span {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.customer-performance-dimensions i {
  overflow: hidden;
  height: 5px;
  border-radius: 999px;
  background: #e5eeee;
}
.customer-performance-dimensions i em {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #16847a, #3ca68f);
}
.customer-performance-alerts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  min-height: 0;
}
.customer-performance-alerts div {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.customer-performance-alerts span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-performance-alerts strong {
  margin-left: auto;
  color: #123b42;
  font-size: 17px;
  line-height: 1;
}
.customer-performance-attention {
  display: grid;
  grid-template-rows: 24px minmax(0, 1fr);
  gap: 6px;
  min-height: 0;
}
.customer-performance-title {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.customer-performance-title h4 {
  margin: 0;
  color: #123b42;
  font-size: 13px;
  font-weight: 850;
}
.customer-performance-list {
  display: grid;
  grid-template-rows: repeat(4, minmax(0, 1fr));
  gap: 6px;
  min-height: 0;
  overflow: hidden;
}
.customer-performance-list button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 44px;
  grid-template-rows: auto auto;
  gap: 3px 8px;
  align-items: center;
  min-width: 0;
  min-height: 0;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-left: 3px solid #8aa2a6;
  border-radius: 8px;
  background: #fff;
  text-align: left;
  cursor: pointer;
}
.customer-performance-list button.good,
.customer-performance-list button.excellent { border-left-color: #16847a; background: #fbfefd; }
.customer-performance-list button.watch { border-left-color: #c27b17; background: #fffdf7; }
.customer-performance-list button.risk { border-left-color: #b6413a; background: #fffafa; }
.customer-performance-list strong {
  overflow: hidden;
  color: #123b42;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-performance-list span {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-performance-list em {
  grid-column: 2;
  grid-row: 1 / span 2;
  justify-self: end;
  color: var(--brand);
  font-size: 15px;
  font-style: normal;
  font-weight: 850;
}
@media (max-width: 1420px) and (min-width: 1181px) {
  .customer-performance-board {
    grid-template-rows: 78px 126px 46px minmax(0, 1fr) !important;
    gap: 6px !important;
    padding: 8px 12px 9px !important;
  }
  .customer-performance-summary {
    grid-template-columns: 102px minmax(0, 1fr);
    gap: 8px;
    padding: 8px 9px;
  }
  .customer-performance-summary strong { font-size: 22px; }
  .customer-performance-dimensions article { padding: 7px 8px; }
  .customer-performance-list { gap: 5px; }
  .customer-performance-list button { padding: 5px 7px; }
}
/* Customer performance scores use red-yellow-green level colors */
.customer-performance-summary.excellent strong,
.customer-performance-summary.excellent em,
.customer-performance-summary.good strong,
.customer-performance-summary.good em {
  color: #0b7d55;
}
.customer-performance-summary.watch strong,
.customer-performance-summary.watch em {
  color: #b66d08;
}
.customer-performance-summary.risk strong,
.customer-performance-summary.risk em {
  color: #b6413a;
}
.customer-performance-dimensions article.excellent b,
.customer-performance-dimensions article.good b,
.customer-performance-list button.excellent em,
.customer-performance-list button.good em {
  color: #0b7d55;
}
.customer-performance-dimensions article.watch b,
.customer-performance-list button.watch em {
  color: #b66d08;
}
.customer-performance-dimensions article.risk b,
.customer-performance-list button.risk em {
  color: #b6413a;
}
.customer-performance-dimensions article.excellent i em,
.customer-performance-dimensions article.good i em {
  background: linear-gradient(90deg, #0b7d55, #36a572);
}
.customer-performance-dimensions article.watch i em {
  background: linear-gradient(90deg, #c27b17, #e4aa3e);
}
.customer-performance-dimensions article.risk i em {
  background: linear-gradient(90deg, #b6413a, #d96b5f);
}
/* Customer performance alert counters use stronger semantic colors */
.customer-performance-alerts div.risk {
  border-color: #efc5c0;
  background: #fff3f1;
  box-shadow: inset 3px 0 0 #b6413a;
}
.customer-performance-alerts div.watch {
  border-color: #efd8a9;
  background: #fff8e8;
  box-shadow: inset 3px 0 0 #c27b17;
}
.customer-performance-alerts div.focus {
  border-color: #d8c9f3;
  background: #f8f4ff;
  box-shadow: inset 3px 0 0 #6d4bc2;
}
.customer-performance-alerts div.risk span,
.customer-performance-alerts div.risk strong { color: #a73532; }
.customer-performance-alerts div.watch span,
.customer-performance-alerts div.watch strong { color: #a86611; }
.customer-performance-alerts div.focus span,
.customer-performance-alerts div.focus strong { color: #57359f; }
.customer-performance-alerts strong {
  font-size: 18px;
  font-weight: 900;
}

/* Customer detail portrait refinements */
.kpi-icon.white { background: #edf6ff; color: #075a9b; }
.kpi-icon.focus { background: #f1f0ff; color: #4b4ab8; }
.kpi-icon.black { background: #f4edf2; color: #4b1634; }
.kpi-icon.normal { background: #eef2f6; color: #4b5d67; }
.kpi-icon.cert { background: #e9f5fb; color: #2676a9; }
.customer-kpi-card.white { border-top-color: #2676a9; }
.customer-kpi-card.focus { border-top-color: #6d4bc2; }
.customer-kpi-card.black { border-top-color: #4b1634; }
.customer-kpi-card.normal { border-top-color: #789096; }
.customer-list-badge.black {
  border-color: #4b1634 !important;
  background: #4b1634 !important;
  color: #fff !important;
}
.customer-list-badge.focus {
  border-color: #c8c7f5 !important;
  background: #f1f0ff !important;
  color: #4b4ab8 !important;
}
.customer-list-badge.white {
  border-color: #b9d6f2 !important;
  background: #edf6ff !important;
  color: #075a9b !important;
}
.customer-list-badge.normal {
  border-color: #d8e0e7 !important;
  background: #f6f8fb !important;
  color: #4b5d67 !important;
}
.customer-tag-cloud span.danger { border-color: #efb5ad; background: #fff4f2; color: #b3261e; }
.customer-tag-cloud span.focus { border-color: #c8c7f5; background: #f3f1ff; color: #4b4ab8; }
.customer-tag-cloud span.green { border-color: #c7e5d4; background: #eef8f3; color: #17855b; }
.customer-tag-cloud span.blue { border-color: #b9d6f2; background: #edf6ff; color: #075a9b; }
.customer-tag-cloud span.teal { border-color: #b9ded9; background: #ecf8f6; color: #087166; }
.customer-tag-cloud span.slate { border-color: #d8e0e7; background: #f6f8fb; color: #4b5d67; }
.customer-ai-action-chip.black,
.customer-list-actions button.black,
.customer-recommend-action-button.black {
  border-color: #4b1634 !important;
  background: #4b1634 !important;
  color: #fff !important;
}
.customer-ai-action-row.black { border-left-color: #4b1634 !important; background: linear-gradient(90deg,#f7eef4,#fff) !important; }
.customer-list-status-grid button.black {
  border-color: #4b1634 !important;
  background: #f7eef4 !important;
}
.customer-list-status-grid button.black strong,
.customer-list-status-grid button.black span { color: #4b1634 !important; }
.customer360-layout.is-selected {
  grid-auto-rows: auto;
  align-items: stretch;
}
.customer360-layout.is-selected > .panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}
.customer360-layout.is-selected .panel-header.compact {
  flex: 0 0 auto;
}
.customer360-layout.is-selected .customer-file-panel,
.customer360-layout.is-selected .customer-risk-portrait-panel,
.customer360-layout.is-selected .customer-relation-panel {
  min-height: 466px;
}
.customer360-layout.is-selected .customer-history-panel,
.customer360-layout.is-selected .customer-eval-panel,
.customer360-layout.is-selected .customer-cert-auth-panel {
  min-height: 338px;
}
.customer360-layout.is-selected .customer-file-scroll {
  flex: 1 1 auto;
  height: 100%;
  max-height: 392px;
  overflow-y: auto;
  overflow-x: hidden;
  align-content: start;
  gap: 6px;
  padding: 10px 12px 12px;
  scrollbar-gutter: stable;
}
.customer360-layout.is-selected .customer-file-scroll div {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  min-height: 42px;
  padding: 8px 9px;
  box-sizing: border-box;
}
.customer360-layout.is-selected .customer-file-scroll span,
.customer360-layout.is-selected .customer-file-scroll strong {
  min-width: 0;
  max-width: 100%;
}
.customer360-layout.is-selected .customer-file-scroll span {
  padding-top: 1px;
  color: #5f7379;
  font-size: 11.5px;
  line-height: 1.35;
  white-space: nowrap;
}
.customer360-layout.is-selected .customer-file-scroll strong {
  display: -webkit-box;
  overflow: hidden;
  color: #173f46;
  font-size: 12.5px;
  line-height: 1.35;
  overflow-wrap: anywhere;
  word-break: break-word;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.customer360-layout.is-selected .customer-risk-portrait-core {
  flex: 1 1 auto;
  grid-template-rows: auto auto minmax(0,1fr);
}
.customer360-layout.is-selected .customer-risk-card-grid article {
  min-height: 88px;
}
.customer360-layout.is-selected .customer-relation-risk {
  margin: 12px 14px 0;
  padding: 11px 12px;
  border: 1px solid #d7e5e1;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #f7faf8;
}
.customer360-layout.is-selected .customer-relation-risk span,
.customer360-layout.is-selected .customer-relation-risk em {
  color: var(--muted-strong);
  font-size: 12px;
  font-style: normal;
}
.customer360-layout.is-selected .customer-relation-risk strong { margin: 0 8px; }
.customer360-layout.is-selected .customer-relation-axis {
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap: 8px;
  padding: 16px 14px 10px;
}
.customer360-layout.is-selected .customer-relation-axis::before {
  left: 44px;
  right: 44px;
  top: 32px;
}
.customer360-layout.is-selected .customer-relation-axis div {
  min-height: 142px;
}
.customer360-layout.is-selected .customer-relation-axis strong {
  min-height: 34px;
  color: #163f46;
  font-size: 12px;
  line-height: 1.35;
}
.customer360-layout.is-selected .customer-relation-axis b,
.customer360-layout.is-selected .customer-relation-axis em {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}
.customer360-layout.is-selected .customer-relation-axis b { -webkit-line-clamp: 2; }
.customer360-layout.is-selected .customer-relation-axis em { -webkit-line-clamp: 3; }
.customer-relation-fill {
  display: grid;
  gap: 9px;
  margin: auto 14px 14px;
}
.customer-relation-fill > div {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 8px;
}
.customer-relation-fill span {
  display: grid;
  gap: 3px;
  min-height: 50px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.customer-relation-fill em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}
.customer-relation-fill strong {
  overflow: hidden;
  color: #123b42;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-relation-fill p {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid #d7e5e1;
  border-radius: 8px;
  background: #fbfdfc;
  color: var(--muted-strong);
  font-size: 12.5px;
  line-height: 1.55;
}
.customer360-layout.is-selected .customer-history-list {
  flex: 1 1 auto;
  max-height: 156px;
  overflow-y: auto;
  align-content: start;
}
.customer360-layout.is-selected .customer-history-list button {
  display: grid;
  grid-template-columns: minmax(0,1fr) 116px 78px 64px;
  min-height: 58px;
  padding: 10px 12px;
  align-items: center;
  gap: 8px;
}
.customer360-layout.is-selected .customer-history-list strong,
.customer360-layout.is-selected .customer-history-list span,
.customer360-layout.is-selected .customer-history-list em,
.customer360-layout.is-selected .customer-history-list i {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-eval-redesign {
  display: grid;
  gap: 10px;
  padding: 12px 14px 14px;
}
.customer-eval-main {
  display: grid;
  grid-template-columns: minmax(0,1fr) 112px;
  gap: 10px;
  align-items: stretch;
}
.customer-eval-main p {
  margin: 0;
  padding: 12px;
  border: 1px solid #d7e5e1;
  border-radius: 8px;
  background: #fbfdfc;
  color: #365b62;
  font-size: 13px;
  line-height: 1.65;
}
.customer-eval-score-card {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 4px;
  border: 1px solid #d7e5e1;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #fff;
}
.customer-eval-score-card span,
.customer-eval-score-card em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}
.customer-eval-score-card strong {
  color: #123b42;
  font-size: 28px;
  line-height: 1;
}
.customer-eval-score-card.excellent,
.customer-eval-score-card.good { border-left-color: #0b7d55; background: #f4fbf6; }
.customer-eval-score-card.watch { border-left-color: #c27b17; background: #fffbf2; }
.customer-eval-score-card.risk { border-left-color: #b6413a; background: #fff7f6; }
.customer-eval-score-card.excellent strong,
.customer-eval-score-card.good strong { color: #0b7d55; }
.customer-eval-score-card.watch strong { color: #b66d08; }
.customer-eval-score-card.risk strong { color: #b6413a; }
.customer-eval-dimensions {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
}
.customer-eval-dimensions article {
  display: grid;
  gap: 7px;
  min-height: 76px;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  background: #fff;
}
.customer-eval-dimensions article.excellent,
.customer-eval-dimensions article.good { border-left-color: #0b7d55; }
.customer-eval-dimensions article.watch { border-left-color: #c27b17; }
.customer-eval-dimensions article.risk { border-left-color: #b6413a; }
.customer-eval-dimensions article div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.customer-eval-dimensions span { color: var(--muted); font-size: 12px; font-weight: 900; }
.customer-eval-dimensions strong { color: #123b42; font-size: 15px; }
.customer-eval-dimensions p {
  margin: 0;
  color: var(--muted-strong);
  font-size: 12px;
  line-height: 1.35;
}
.customer-eval-dimensions i {
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: #e9edf2;
}
.customer-eval-dimensions b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg,var(--brand),#28a697);
}
.customer-eval-dimensions article.excellent b,
.customer-eval-dimensions article.good b { background: linear-gradient(90deg,#0b7d55,#36a572); }
.customer-eval-dimensions article.watch b { background: linear-gradient(90deg,#c27b17,#e4aa3e); }
.customer-eval-dimensions article.risk b { background: linear-gradient(90deg,#b6413a,#d96b5f); }
.customer-cert-auth-board.detailed {
  flex: 1 1 auto;
  grid-template-rows: auto auto minmax(0,1fr);
  align-content: stretch;
}
.customer-cert-auth-board.detailed article {
  display: grid;
  gap: 7px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.customer-cert-auth-board.detailed span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.customer-cert-auth-board.detailed p {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  color: var(--muted-strong);
  font-size: 12.5px;
  line-height: 1.5;
}
.customer-cert-auth-board.detailed em {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid #d7e5e1;
  border-radius: 999px;
  background: #f7faf8;
  color: #31575c;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}
.customer-cert-auth-verdict {
  border-left: 4px solid var(--brand) !important;
  background: #fbfdfc !important;
}
.customer-cert-auth-verdict.high { border-left-color: var(--red) !important; background: #fff7f6 !important; }
.customer-cert-auth-verdict.medium { border-left-color: var(--amber) !important; background: #fffbf2 !important; }
.customer-cert-auth-verdict.low { border-left-color: var(--green) !important; background: #f4fbf6 !important; }
.customer-cert-auth-verdict strong {
  color: #123b42;
  font-size: 20px;
  line-height: 1.1;
}
@media (max-width: 1420px) {
  .customer360-layout.is-selected .customer-relation-axis { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .customer360-layout.is-selected .customer-relation-axis::before { display: none; }
}
@media (max-width: 1180px) {
  .customer360-layout.is-selected .customer-file-panel,
  .customer360-layout.is-selected .customer-risk-portrait-panel,
  .customer360-layout.is-selected .customer-relation-panel,
  .customer360-layout.is-selected .customer-history-panel,
  .customer360-layout.is-selected .customer-eval-panel,
  .customer360-layout.is-selected .customer-cert-auth-panel { min-height: auto; }
  .customer-eval-main,
  .customer-eval-dimensions,
  .customer-relation-fill > div { grid-template-columns: 1fr; }
}


/* Customer selected portrait height lock across counterparties */
.customer-kpi-board.is-selected .customer-kpi-card {
  height: 112px;
  min-height: 112px;
  max-height: 112px;
  overflow: hidden;
  box-sizing: border-box;
}
.customer-kpi-board.is-selected .customer-kpi-card div {
  min-width: 0;
  overflow: hidden;
}
.customer-kpi-board.is-selected .customer-kpi-card div > span,
.customer-kpi-board.is-selected .customer-kpi-card strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-kpi-board.is-selected .customer-kpi-card em {
  display: -webkit-box;
  max-height: 38px;
  min-height: 31px;
  overflow: hidden;
  color: var(--muted-strong);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
@media (min-width: 1181px) {
  .customer360-layout.is-selected {
    grid-template-rows: 466px 338px;
    grid-auto-rows: 0;
  }
  .customer360-layout.is-selected .customer-file-panel,
  .customer360-layout.is-selected .customer-risk-portrait-panel,
  .customer360-layout.is-selected .customer-relation-panel {
    height: 466px;
    min-height: 466px;
    max-height: 466px;
  }
  .customer360-layout.is-selected .customer-history-panel,
  .customer360-layout.is-selected .customer-eval-panel,
  .customer360-layout.is-selected .customer-cert-auth-panel {
    height: 338px;
    min-height: 338px;
    max-height: 338px;
  }
  .customer360-layout.is-selected .customer-risk-portrait-core,
  .customer360-layout.is-selected .customer-relation-panel > :not(.panel-header),
  .customer360-layout.is-selected .customer-eval-redesign,
  .customer360-layout.is-selected .customer-cert-auth-board.detailed {
    min-height: 0;
  }
  .customer360-layout.is-selected .customer-tag-cloud {
    max-height: 68px;
    overflow: hidden;
  }
  .customer360-layout.is-selected .customer-tag-cloud span {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .customer360-layout.is-selected .customer-risk-card-grid {
    align-content: start;
  }
  .customer360-layout.is-selected .customer-risk-card-grid article {
    height: 88px;
    min-height: 88px;
    max-height: 88px;
    overflow: hidden;
  }
  .customer360-layout.is-selected .customer-relation-axis {
    flex: 0 0 auto;
    max-height: 184px;
    overflow: hidden;
  }
  .customer360-layout.is-selected .customer-relation-axis div {
    height: 142px;
    min-height: 142px;
    max-height: 142px;
    overflow: hidden;
  }
  .customer-relation-fill {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
  }
  .customer-relation-fill p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }
  .customer360-layout.is-selected .customer-history-list,
  .customer360-layout.is-selected .customer-file-scroll {
    min-height: 0;
  }
  .customer-eval-main p,
  .customer-cert-auth-verdict p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
  }
  .customer-eval-main p { -webkit-line-clamp: 4; }
  .customer-cert-auth-verdict p { -webkit-line-clamp: 3; }
  .customer-cert-auth-board.detailed article {
    min-height: 0;
    overflow: hidden;
  }
}


/* Customer relationship risk semantic colors */
.customer360-layout.is-selected .customer-relation-risk.high {
  border-color: #efc5c0;
  border-left-color: var(--red);
  background: #fff7f6;
}
.customer360-layout.is-selected .customer-relation-risk.medium {
  border-color: #efd8a9;
  border-left-color: var(--amber);
  background: #fffbf2;
}
.customer360-layout.is-selected .customer-relation-risk.low {
  border-color: #c7e5d4;
  border-left-color: var(--green);
  background: #f4fbf6;
}
.customer360-layout.is-selected .customer-relation-risk.high span,
.customer360-layout.is-selected .customer-relation-risk.high em { color: #9f342d; }
.customer360-layout.is-selected .customer-relation-risk.medium span,
.customer360-layout.is-selected .customer-relation-risk.medium em { color: #9a640f; }
.customer360-layout.is-selected .customer-relation-risk.low span,
.customer360-layout.is-selected .customer-relation-risk.low em { color: #17855b; }


/* Customer portrait internal scroll bounds */
@media (min-width: 1181px) {
  .customer360-layout.is-selected .customer-file-scroll,
  .customer360-layout.is-selected .customer-history-list {
    min-height: 0;
    margin: 10px 14px 0;
    padding: 10px;
    border: 1px solid #d7e5e1;
    border-radius: 8px;
    background: #fbfdfc;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    contain: paint;
  }
  .customer360-layout.is-selected .customer-file-scroll {
    flex: 0 0 392px;
    height: 392px;
    max-height: 392px;
    margin: 20px 14px 4px;
    gap: 4px;
    align-content: start;
  }
  .customer360-layout.is-selected .customer-file-scroll div {
    display: grid;
    grid-template-columns: 104px minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    min-height: 44px;
    height: 44px;
    max-height: 44px;
    padding: 3px 10px;
    border-radius: 7px;
    overflow: hidden;
    box-sizing: border-box;
  }
  .customer360-layout.is-selected .customer-file-scroll span {
    min-width: 0;
    color: #5f7379;
    font-size: 11.5px;
    line-height: 1.35;
    white-space: nowrap;
  }
  .customer360-layout.is-selected .customer-file-scroll strong {
    display: -webkit-box;
    min-width: 0;
    overflow: hidden;
    color: #173f46;
    font-size: 12.5px;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .customer360-layout.is-selected .customer-history-list {
    flex: 0 0 281px;
    height: 281px;
    max-height: 281px;
    gap: 4px;
    align-content: start;
    grid-auto-rows: max-content;
  }
  .customer360-layout.is-selected .customer-history-list button {
    height: 50px;
    min-height: 50px;
    max-height: 50px;
    overflow: hidden;
    align-content: center;
    padding: 5px 9px;
  }
}

@media (min-width: 1181px) {
  .customer360-layout.is-selected .customer-eval-redesign {
    flex: 1 1 auto;
    min-height: 0;
    margin: 10px 14px 0;
    padding: 10px;
    border: 1px solid #d7e5e1;
    border-radius: 8px;
    background: #fbfdfc;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    contain: paint;
  }
  .customer360-layout.is-selected .customer-eval-main {
    grid-template-columns: minmax(0,1fr) 104px;
    gap: 8px;
  }
  .customer360-layout.is-selected .customer-eval-main p {
    padding: 9px 10px;
    font-size: 12.5px;
    line-height: 1.45;
    -webkit-line-clamp: 3;
  }
  .customer360-layout.is-selected .customer-eval-score-card strong { font-size: 24px; }
  .customer360-layout.is-selected .customer-eval-dimensions { gap: 6px; }
  .customer360-layout.is-selected .customer-eval-dimensions article {
    min-height: 58px;
    padding: 7px 8px;
    gap: 4px;
  }
  .customer360-layout.is-selected .customer-eval-dimensions p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
  }
}
/* Customer portrait detail polish */
@media (min-width: 1181px) {
  .customer360-layout.is-selected .customer-file-scroll {
    flex: 0 0 396px;
    height: 396px;
    max-height: 396px;
    margin: 20px 14px 0;
  }
  .customer360-layout.is-selected .customer-history-list {
    flex: 0 0 271px;
    height: 271px;
    max-height: 271px;
    margin: 10px 14px 10px;
  }
  .customer360-layout.is-selected .customer-history-list button {
    height: 48px;
    min-height: 48px;
    max-height: 48px;
  }
  .customer360-layout.is-selected .customer-risk-portrait-panel.high { border-top-color: var(--red); }
  .customer360-layout.is-selected .customer-risk-portrait-panel.medium { border-top-color: var(--amber); }
  .customer360-layout.is-selected .customer-risk-portrait-panel.low { border-top-color: var(--green); }
  .customer360-layout.is-selected .customer-relation-panel {
    --relation-accent: var(--brand);
  }
  .customer360-layout.is-selected .customer-relation-panel:has(.customer-relation-risk.high) { --relation-accent: var(--red); }
  .customer360-layout.is-selected .customer-relation-panel:has(.customer-relation-risk.medium) { --relation-accent: var(--amber); }
  .customer360-layout.is-selected .customer-relation-panel:has(.customer-relation-risk.low) { --relation-accent: var(--green); }
  .customer360-layout.is-selected .customer-relation-risk {
    display: grid;
    grid-template-columns: 86px 74px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    min-height: 52px;
    margin: 12px 14px 0;
    padding: 10px 12px;
    border-left-color: var(--relation-accent);
  }
  .customer360-layout.is-selected .customer-relation-risk span,
  .customer360-layout.is-selected .customer-relation-risk strong,
  .customer360-layout.is-selected .customer-relation-risk em {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .customer360-layout.is-selected .customer-relation-axis {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
    padding: 10px 14px 0;
  }
  .customer360-layout.is-selected .customer-relation-axis::before { display: none; }
  .customer360-layout.is-selected .customer-relation-axis div {
    display: grid;
    grid-template-columns: 26px minmax(0,1fr);
    grid-template-rows: auto auto auto;
    justify-items: stretch;
    align-items: start;
    gap: 3px 8px;
    height: 74px;
    min-height: 74px;
    max-height: 74px;
    padding: 8px 9px;
    border: 1px solid #d7e5e1;
    border-left: 3px solid var(--relation-accent);
    border-radius: 8px;
    background: #fbfdfc;
    text-align: left;
    overflow: hidden;
  }
  .customer360-layout.is-selected .customer-relation-axis div:nth-child(5) {
    grid-column: 1 / -1;
    height: 62px;
    min-height: 62px;
    max-height: 62px;
  }
  .customer360-layout.is-selected .customer-relation-axis span {
    grid-row: 1 / span 3;
    width: 22px;
    height: 22px;
    border-color: color-mix(in srgb, var(--relation-accent) 35%, #d7e5e1);
    background: #fff;
    color: var(--relation-accent);
    font-size: 11px;
    box-shadow: none;
  }
  .customer360-layout.is-selected .customer-relation-axis strong,
  .customer360-layout.is-selected .customer-relation-axis b,
  .customer360-layout.is-selected .customer-relation-axis em {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-align: left;
  }
  .customer360-layout.is-selected .customer-relation-axis strong {
    color: #163f46;
    font-size: 12.5px;
    line-height: 1.25;
    -webkit-line-clamp: 1;
  }
  .customer360-layout.is-selected .customer-relation-axis b {
    color: #123b42;
    font-size: 12px;
    font-weight: 900;
    line-height: 1.25;
    -webkit-line-clamp: 1;
  }
  .customer360-layout.is-selected .customer-relation-axis em {
    color: #5f7379;
    font-size: 11.5px;
    line-height: 1.3;
    -webkit-line-clamp: 2;
  }
  .customer-relation-fill {
    gap: 8px;
    margin: 10px 14px 14px;
  }
  .customer-relation-fill span {
    min-height: 44px;
    padding: 7px 8px;
  }
  .customer-relation-fill p {
    display: -webkit-box;
    max-height: 58px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
}
/* Customer portrait detail final alignment */
@media (min-width: 1181px) {
  .customer360-layout.is-selected .customer-file-scroll {
    flex-basis: 394px;
    height: 394px;
    max-height: 394px;
  }
  .customer360-layout.is-selected .customer-relation-risk {
    min-height: 56px;
    padding: 9px 12px;
  }
  .customer360-layout.is-selected .customer-relation-axis {
    max-height: none;
    overflow: hidden;
    gap: 6px;
    padding-top: 8px;
  }
  .customer360-layout.is-selected .customer-relation-axis div {
    height: 54px;
    min-height: 54px;
    max-height: 54px;
    gap: 2px 8px;
    padding: 6px 8px;
  }
  .customer360-layout.is-selected .customer-relation-axis div:nth-child(5) {
    height: 48px;
    min-height: 48px;
    max-height: 48px;
  }
  .customer360-layout.is-selected .customer-relation-axis span {
    width: 20px;
    height: 20px;
    font-size: 10px;
  }
  .customer360-layout.is-selected .customer-relation-axis strong { font-size: 12px; line-height: 1.2; }
  .customer360-layout.is-selected .customer-relation-axis b { font-size: 11.5px; line-height: 1.2; }
  .customer360-layout.is-selected .customer-relation-axis em { font-size: 11px; line-height: 1.2; -webkit-line-clamp: 1; }
  .customer-relation-fill {
    margin: 8px 14px 14px;
    gap: 6px;
  }
  .customer-relation-fill span {
    min-height: 38px;
    padding: 6px 8px;
  }
  .customer-relation-fill p {
    max-height: 48px;
    padding: 8px 10px;
    font-size: 12px;
    line-height: 1.35;
  }
}
/* Customer portrait vertical edge alignment */
@media (min-width: 1181px) {
  .customer360-layout.is-selected .customer-risk-portrait-core {
    padding: 20px 14px 6px;
  }
  .customer360-layout.is-selected .customer-relation-risk {
    margin-top: 20px;
  }
  .customer360-layout.is-selected .customer-cert-auth-board.detailed {
    flex: 0 0 271px;
    height: 271px;
    max-height: 271px;
    margin: 10px 14px 10px;
    overflow: hidden;
  }
}
/* Customer portrait final top-line sync */
@media (min-width: 1181px) {
  .customer360-layout.is-selected .customer-risk-portrait-core {
    margin-top: 8px;
    padding-top: 12px;
  }
  .customer360-layout.is-selected .customer-eval-redesign {
    flex: 0 0 271px;
    height: 271px;
    max-height: 271px;
    margin: 10px 14px 10px;
  }
}
/* Customer portrait readability pass */
@media (min-width: 1181px) {
  .customer360-layout.is-selected .customer-relation-axis {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .customer360-layout.is-selected .customer-relation-axis div,
  .customer360-layout.is-selected .customer-relation-axis div:nth-child(5) {
    grid-column: auto;
    grid-template-columns: 24px 108px minmax(90px,.9fr) minmax(0,1.15fr);
    grid-template-rows: 1fr;
    align-items: center;
    height: 42px;
    min-height: 42px;
    max-height: 42px;
    gap: 8px;
    padding: 6px 9px;
  }
  .customer360-layout.is-selected .customer-relation-axis span {
    grid-row: auto;
    width: 20px;
    height: 20px;
    place-self: center;
  }
  .customer360-layout.is-selected .customer-relation-axis strong,
  .customer360-layout.is-selected .customer-relation-axis b,
  .customer360-layout.is-selected .customer-relation-axis em {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.25;
  }
  .customer-relation-fill {
    margin-top: 8px;
  }
  .customer-relation-fill > div {
    gap: 6px;
  }
  .customer-relation-fill span {
    min-height: 36px;
  }
  .customer360-layout.is-selected .customer-cert-auth-board.detailed {
    display: grid;
    grid-template-rows: repeat(3, minmax(0,1fr));
    gap: 7px;
    padding: 10px;
    align-content: stretch;
  }
  .customer360-layout.is-selected .customer-cert-auth-board.detailed article {
    display: grid;
    grid-template-columns: 68px minmax(0,1fr);
    grid-template-rows: 1fr;
    align-items: center;
    gap: 8px;
    min-height: 0;
    padding: 7px 9px;
    overflow: hidden;
  }
  .customer360-layout.is-selected .customer-cert-auth-board.detailed article > span {
    align-self: center;
    color: #31575c;
    font-size: 12px;
    line-height: 1.25;
  }
  .customer360-layout.is-selected .customer-cert-auth-board.detailed article > p {
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    gap: 4px 5px;
    min-width: 0;
    max-height: 54px;
    overflow: hidden;
    font-size: 12px;
    line-height: 1.25;
  }
  .customer360-layout.is-selected .customer-cert-auth-board.detailed article em {
    max-width: 100%;
    min-height: 20px;
    padding: 2px 6px;
    overflow: hidden;
    font-size: 11.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .customer360-layout.is-selected .customer-cert-auth-verdict {
    grid-template-columns: 68px 64px minmax(0,1fr) !important;
  }
  .customer360-layout.is-selected .customer-cert-auth-verdict strong {
    font-size: 18px;
    text-align: center;
  }
  .customer360-layout.is-selected .customer-cert-auth-verdict p {
    display: -webkit-box;
    max-height: 40px;
    overflow: hidden;
    color: #31575c;
    font-size: 12px;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
}
/* Login redesign: state-owned listed enterprise governance style */
.login-screen {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(560px, 1.04fr) minmax(460px, .96fr);
  background:
    linear-gradient(90deg, transparent 0 58%, rgba(243,247,246,.96) 58% 100%),
    radial-gradient(circle at 78% 18%, rgba(14,118,110,.12), transparent 32%),
    #f3f7f6;
}
.login-aside {
  position: relative;
  isolation: isolate;
  justify-content: space-between;
  gap: 44px;
  padding: 46px 54px 42px;
  background:
    linear-gradient(135deg, rgba(6,45,44,.98) 0%, rgba(8,70,66,.96) 52%, rgba(9,92,84,.95) 100%),
    radial-gradient(circle at 18% 24%, rgba(200,164,93,.2), transparent 30%);
}
.login-aside::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 0;
  border-radius: 0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px) 0 0 / 64px 64px,
    linear-gradient(0deg, rgba(255,255,255,.055) 1px, transparent 1px) 0 0 / 64px 64px,
    linear-gradient(135deg, transparent 0 58%, rgba(200,164,93,.16) 58% 58.8%, transparent 58.8% 100%);
  opacity: .58;
  pointer-events: none;
}
.login-aside::after {
  content: "";
  position: absolute;
  right: 52px;
  top: 128px;
  width: 252px;
  height: 252px;
  border: 1px solid rgba(200,164,93,.26);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(255,255,255,.08) 0 38%, transparent 39%),
    conic-gradient(from 45deg, rgba(200,164,93,.18), transparent 18%, rgba(255,255,255,.09) 34%, transparent 52%, rgba(200,164,93,.14) 74%, transparent 100%);
  box-shadow: inset 0 0 0 18px rgba(255,255,255,.025), 0 24px 54px rgba(0,0,0,.16);
  opacity: .9;
  pointer-events: none;
}
.login-brand,
.login-copy,
.login-aside-footer {
  position: relative;
  z-index: 1;
}
.login-brand {
  align-items: center;
  max-width: 620px;
}
.login-brand .brand-mark.large {
  width: 52px;
  height: 52px;
  border-color: rgba(221,193,132,.72);
  background: linear-gradient(145deg, #0b5954, #073b3a 58%, #c8a45d 160%);
  box-shadow: 0 12px 28px rgba(0,0,0,.2);
  letter-spacing: .04em;
}
.login-brand strong {
  color: #ffffff;
  font-size: 17px;
  font-weight: 900;
  line-height: 1.25;
}
.login-brand span {
  color: rgba(235,245,241,.78);
  font-size: 12.5px;
  letter-spacing: .02em;
}
.login-copy {
  max-width: 640px;
  margin-top: auto;
  margin-bottom: auto;
}
.gov-badge {
  min-height: 32px;
  padding: 6px 13px;
  border-color: rgba(221,193,132,.62);
  background: rgba(200,164,93,.18);
  color: #ffe7aa;
  font-weight: 800;
  letter-spacing: .02em;
}
.login-copy h1 {
  max-width: 620px;
  margin-top: 24px;
  color: #fff;
  font-size: clamp(38px, 4vw, 56px);
  line-height: 1.14;
  letter-spacing: 0;
}
.login-screen .login-copy > p,
.login-screen .login-card > p {
  display: block !important;
}
.login-copy p {
  max-width: 560px;
  margin-top: 18px;
  color: rgba(239,249,246,.9);
  font-size: 17px;
  line-height: 1.7;
}
.login-governance-panel {
  display: grid;
  grid-template-columns: repeat(4, max-content);
  gap: 10px;
  margin-top: 28px;
}
.login-governance-panel span,
.login-capabilities span {
  display: inline-grid;
  place-items: center;
  min-height: 30px;
  padding: 5px 12px;
  border: 1px solid rgba(211,229,224,.22);
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: rgba(244,250,248,.92);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.login-aside-footer {
  display: grid;
  gap: 14px;
}
.login-stats {
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
}
.login-stats button {
  min-height: 96px;
  padding: 14px 14px 13px;
  border-color: rgba(221,193,132,.3);
  background: linear-gradient(180deg, rgba(7,39,40,.78), rgba(7,54,52,.58));
  box-shadow: 0 16px 34px rgba(0,0,0,.16);
}
.login-stats button:hover {
  border-color: rgba(221,193,132,.68);
  background: linear-gradient(180deg, rgba(8,55,54,.88), rgba(8,73,68,.68));
}
.login-stats span {
  color: rgba(230,243,239,.78);
  font-weight: 800;
}
.login-stats strong {
  margin-top: 7px;
  color: #ffe3a0;
  font-size: 30px;
  line-height: 1;
}
.login-stats em {
  max-height: 32px;
  overflow: hidden;
  color: rgba(239,247,244,.78);
  font-size: 11.5px;
  line-height: 1.35;
}
.login-capabilities {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}
.login-panel {
  position: relative;
  display: grid;
  align-items: center;
  justify-items: center;
  padding: 44px;
  background:
    radial-gradient(circle at 12% 16%, rgba(14,118,110,.08), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.8), rgba(244,248,247,.96));
}
.login-panel::before {
  content: "";
  position: absolute;
  inset: 32px;
  border: 1px solid rgba(15,118,110,.08);
  border-radius: 16px;
  pointer-events: none;
}
.login-card {
  position: relative;
  z-index: 1;
  width: min(484px,100%);
  padding: 34px;
  border: 1px solid #dbe7e4;
  border-radius: 10px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 24px 62px rgba(24,64,62,.13);
}
.login-card .breadcrumb {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  background: #edf6f4;
  color: #0e766e;
  font-size: 12px;
  font-weight: 900;
}
.login-card h2 {
  margin-top: 16px;
  color: #0f2529;
  font-size: 30px;
  line-height: 1.2;
}
.login-card p {
  margin-top: 9px;
  color: #587075;
  font-size: 14px;
  line-height: 1.6;
}
.login-field {
  gap: 8px;
  margin-top: 18px;
  color: #3c5960;
  font-size: 13px;
  font-weight: 800;
}
.login-field select,
.password-wrap input {
  height: 44px;
  border-color: #d4e3df;
  border-radius: 8px;
  background: #fbfdfc;
}
.password-wrap {
  grid-template-columns: minmax(0,1fr) 44px;
}
.password-toggle {
  width: 44px;
  height: 44px;
  border-color: #d4e3df;
  background: #fbfdfc;
}
.login-options {
  margin-top: 14px;
}
.login-options button {
  color: #0e766e;
  font-weight: 800;
}
.login-org {
  margin-top: 18px;
  padding: 12px 14px;
  border-color: #d4e3df;
  background: linear-gradient(180deg, #f7fbfa, #f2f8f6);
}
.login-submit {
  min-height: 46px;
  margin-top: 22px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 900;
}
@media (max-width: 1180px) {
  .login-screen {
    grid-template-columns: 1fr;
    background: #f3f7f6;
  }
  .login-aside {
    min-height: auto;
    padding: 34px;
  }
  .login-aside::after {
    top: 72px;
    right: 28px;
    width: 176px;
    height: 176px;
  }
  .login-copy {
    margin: 48px 0 36px;
  }
  .login-governance-panel {
    grid-template-columns: repeat(2, max-content);
  }
  .login-panel {
    padding: 34px;
  }
}
@media (max-width: 680px) {
  .login-aside {
    padding: 28px 22px;
  }
  .login-copy h1 {
    font-size: 32px;
  }
  .login-governance-panel,
  .login-stats {
    grid-template-columns: 1fr;
  }
  .login-panel {
    padding: 18px;
  }
  .login-panel::before {
    inset: 12px;
  }
  .login-card {
    padding: 24px;
  }
}
/* Login reference alignment: full dark governance canvas with floating sign-in card */
.login-screen {
  position: relative;
  isolation: isolate;
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(620px, 60.5fr) minmax(500px, 39.5fr);
  overflow: hidden;
  background:
    radial-gradient(circle at 78% 18%, rgba(18, 128, 119, .42), transparent 19%),
    radial-gradient(circle at 28% 62%, rgba(202, 164, 96, .18), transparent 18%),
    linear-gradient(115deg, #002728 0%, #002b2c 42%, #003738 68%, #055d5d 100%);
}
.login-screen::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.048) 1px, transparent 1px) 0 0 / 62px 62px,
    linear-gradient(0deg, rgba(255,255,255,.044) 1px, transparent 1px) 0 0 / 62px 62px,
    linear-gradient(135deg, transparent 0 45%, rgba(220,185,112,.12) 45.08% 45.55%, transparent 45.65% 100%);
  opacity: .7;
  pointer-events: none;
}
.login-screen::after {
  content: "";
  position: absolute;
  left: 20.5%;
  bottom: 11%;
  z-index: 0;
  width: 520px;
  height: 260px;
  border: 1px solid rgba(219, 184, 111, .15);
  border-radius: 999px 999px 0 0;
  background:
    radial-gradient(circle at 22% 70%, rgba(219,184,111,.52) 0 5px, transparent 6px),
    radial-gradient(circle at 47% 28%, rgba(255,255,255,.18) 0 3px, transparent 4px),
    radial-gradient(circle at 72% 62%, rgba(24,139,130,.55) 0 6px, transparent 7px);
  opacity: .55;
  transform: rotate(-8deg);
  pointer-events: none;
}
.login-aside,
.login-panel {
  position: relative;
  z-index: 1;
}
.login-aside {
  min-height: 100vh;
  padding: 52px 56px 54px 72px;
  background: transparent;
  color: #fff;
}
.login-aside::before,
.login-aside::after,
.login-panel::before {
  content: none;
}
.login-brand {
  display: flex;
  align-items: center;
  gap: 14px;
  max-width: 680px;
}
.login-brand .brand-mark.large {
  width: 48px;
  height: 48px;
  border: 1px solid rgba(229, 197, 128, .72);
  border-radius: 11px;
  background: linear-gradient(145deg, rgba(0,96,88,.9), rgba(0,46,47,.92));
  box-shadow: 0 16px 36px rgba(0,0,0,.24);
  color: #ffe3a0;
  font-size: 16px;
}
.login-brand strong {
  color: #fff;
  font-size: 18px;
  font-weight: 900;
}
.login-brand span {
  margin-top: 5px;
  color: rgba(235, 246, 242, .72);
  font-size: 12px;
}
.login-copy {
  max-width: 760px;
  margin: 12vh 0 0;
}
.gov-badge {
  min-height: 30px;
  padding: 5px 13px;
  border: 1px solid rgba(229,197,128,.66);
  border-radius: 999px;
  background: rgba(218, 175, 93, .16);
  color: #ffe2a2;
  font-size: 12px;
  font-weight: 900;
}
.login-copy h1 {
  max-width: 720px;
  margin-top: 28px;
  color: #fff;
  font-size: clamp(44px, 4.9vw, 68px);
  line-height: 1.1;
  font-weight: 900;
}
.login-screen .login-copy > p,
.login-screen .login-card > p {
  display: block !important;
}
.login-copy p {
  max-width: 640px;
  margin-top: 20px;
  color: rgba(239, 249, 246, .88);
  font-size: 18px;
  line-height: 1.75;
}
.login-governance-panel {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 34px;
}
.login-governance-panel span,
.login-capabilities span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 5px 13px;
  border: 1px solid rgba(220, 238, 232, .2);
  border-radius: 999px;
  background: rgba(255, 255, 255, .075);
  color: rgba(245,250,248,.92);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.login-aside-footer {
  display: grid;
  gap: 14px;
  margin-top: auto;
  max-width: 760px;
}
.login-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.login-stats button {
  min-height: 108px;
  padding: 16px 16px 14px;
  border: 1px solid rgba(226,196,126,.28);
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(4, 39, 40, .84), rgba(5, 57, 55, .68));
  box-shadow: 0 18px 42px rgba(0,0,0,.22);
  color: inherit;
  text-align: left;
}
.login-stats button:hover {
  border-color: rgba(226,196,126,.68);
  background: linear-gradient(180deg, rgba(6,55,55,.92), rgba(7,73,68,.75));
}
.login-stats span {
  color: rgba(232, 245, 241, .78);
  font-size: 12px;
  font-weight: 800;
}
.login-stats strong {
  display: block;
  margin-top: 10px;
  color: #ffe1a0;
  font-size: 32px;
  line-height: 1;
}
.login-stats em {
  display: block;
  max-height: 34px;
  margin-top: 8px;
  overflow: hidden;
  color: rgba(239,247,244,.76);
  font-size: 11.5px;
  font-style: normal;
  line-height: 1.45;
}
.login-capabilities {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.login-panel {
  display: flex;
  min-height: 100vh;
  align-items: center;
  justify-content: flex-start;
  padding: 64px 76px 64px 0;
  background: transparent;
}
.login-card {
  width: min(580px, 100%);
  min-height: min(754px, calc(100vh - 128px));
  padding: 48px 58px 42px;
  border: 0;
  border-left: 5px solid #0f766e;
  border-radius: 14px;
  background: rgba(255,255,255,.985);
  box-shadow: 0 30px 84px rgba(0, 18, 19, .36);
}
.login-card .breadcrumb {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  padding: 4px 12px;
  border-radius: 999px;
  background: #eaf5f2;
  color: #0f766e;
  font-size: 12px;
  font-weight: 900;
}
.login-card h2 {
  margin-top: 22px;
  color: #0f2529;
  font-size: 34px;
  line-height: 1.18;
  font-weight: 900;
}
.login-card p {
  margin-top: 10px;
  color: #5a7278;
  font-size: 14px;
  line-height: 1.65;
}
.login-field {
  gap: 9px;
  margin-top: 22px;
  color: #35565d;
  font-size: 13px;
  font-weight: 800;
}
.login-field select,
.password-wrap input {
  height: 48px;
  border: 1px solid #d7e6e2;
  border-radius: 10px;
  background: #fbfdfc;
  padding: 0 13px;
  color: #143439;
}
.password-wrap {
  grid-template-columns: minmax(0, 1fr) 48px;
  gap: 10px;
}
.password-toggle {
  width: 48px;
  height: 48px;
  border-color: #d7e6e2;
  border-radius: 10px;
  background: #fbfdfc;
}
.login-options {
  margin-top: 16px;
  color: #60777d;
}
.login-options button {
  color: #0f766e;
  font-weight: 900;
}
.login-org {
  margin-top: 24px;
  padding: 14px 16px;
  border: 1px solid #d8e8e4;
  border-radius: 10px;
  background: linear-gradient(180deg, #f7fbfa, #f1f8f6);
}
.login-submit {
  min-height: 48px;
  margin-top: 24px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 900;
}
@media (max-width: 1180px) {
  .login-screen {
    display: block;
    min-height: 100vh;
    overflow: auto;
  }
  .login-aside {
    min-height: auto;
    padding: 34px;
  }
  .login-copy {
    margin-top: 56px;
  }
  .login-aside-footer {
    margin-top: 56px;
  }
  .login-panel {
    min-height: auto;
    padding: 0 34px 40px;
    justify-content: center;
  }
  .login-card {
    min-height: auto;
  }
}
@media (max-width: 680px) {
  .login-aside {
    padding: 28px 22px;
  }
  .login-brand {
    align-items: flex-start;
  }
  .login-copy {
    margin-top: 46px;
  }
  .login-copy h1 {
    font-size: 36px;
  }
  .login-copy p {
    font-size: 15px;
  }
  .login-stats {
    grid-template-columns: 1fr;
  }
  .login-panel {
    padding: 0 18px 28px;
  }
  .login-card {
    padding: 28px 24px;
    border-left-width: 4px;
  }
}

/* Login visual polish: animated governance-grade rendering */
.login-screen {
  background:
    radial-gradient(circle at 79% 16%, rgba(29, 164, 149, .48), transparent 18%),
    radial-gradient(circle at 16% 78%, rgba(222, 180, 99, .2), transparent 21%),
    radial-gradient(circle at 43% 38%, rgba(18, 118, 110, .18), transparent 24%),
    linear-gradient(115deg, #001f21 0%, #002b2c 39%, #003638 64%, #055c5d 100%);
}
.login-screen::before {
  background:
    radial-gradient(circle, rgba(234, 211, 154, .32) 0 1.4px, transparent 1.7px) 0 0 / 96px 96px,
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px) 0 0 / 62px 62px,
    linear-gradient(0deg, rgba(255,255,255,.048) 1px, transparent 1px) 0 0 / 62px 62px,
    linear-gradient(135deg, transparent 0 43%, rgba(220,185,112,.12) 43.08% 43.42%, transparent 43.55% 100%),
    linear-gradient(28deg, transparent 0 57%, rgba(34, 168, 153, .14) 57.08% 57.42%, transparent 57.55% 100%);
  opacity: .88;
  animation: loginGridDrift 24s linear infinite;
}
.login-screen::after {
  left: 31.5%;
  top: 19%;
  bottom: auto;
  width: 520px;
  height: 520px;
  border: 0;
  border-radius: 50%;
  background:
    conic-gradient(from 0deg, rgba(226, 190, 112, .08), rgba(226, 190, 112, .62) 11%, transparent 20%, rgba(34, 160, 148, .46) 36%, transparent 48%, rgba(226, 190, 112, .5) 63%, transparent 78%, rgba(34, 160, 148, .36) 91%, rgba(226, 190, 112, .08)),
    radial-gradient(circle, transparent 0 49%, rgba(255,255,255,.08) 49.5% 50.8%, transparent 51.2% 63%, rgba(226,190,112,.18) 63.4% 64.5%, transparent 65%);
  -webkit-mask: radial-gradient(circle, transparent 0 43%, #000 44% 67%, transparent 68%);
  mask: radial-gradient(circle, transparent 0 43%, #000 44% 67%, transparent 68%);
  opacity: .62;
  transform: rotate(0deg);
  animation: loginOrbit 30s linear infinite;
}
.login-aside::before {
  content: "";
  position: absolute;
  left: 74px;
  bottom: 178px;
  z-index: 0;
  width: 440px;
  height: 246px;
  border: 1px solid rgba(231, 199, 128, .18);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.015)),
    repeating-linear-gradient(90deg, transparent 0 42px, rgba(255,255,255,.07) 43px 44px),
    linear-gradient(135deg, rgba(13, 111, 103, .28), rgba(1, 38, 39, .05));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 28px 70px rgba(0,0,0,.18);
  transform: skewX(-9deg) rotate(-2deg);
  opacity: .66;
  pointer-events: none;
}
.login-aside::after {
  content: "";
  position: absolute;
  left: 122px;
  bottom: 196px;
  z-index: 0;
  width: 360px;
  height: 188px;
  border-radius: 14px;
  background:
    radial-gradient(circle at 8% 76%, rgba(226,190,112,.86) 0 5px, transparent 6px),
    radial-gradient(circle at 34% 38%, rgba(34,160,148,.82) 0 4px, transparent 5px),
    radial-gradient(circle at 62% 68%, rgba(226,190,112,.74) 0 5px, transparent 6px),
    radial-gradient(circle at 88% 22%, rgba(255,255,255,.44) 0 3px, transparent 4px),
    linear-gradient(24deg, transparent 7%, rgba(226,190,112,.52) 7.2% 7.9%, transparent 8.1% 34%, rgba(34,160,148,.42) 34.2% 34.9%, transparent 35.1% 68%, rgba(226,190,112,.42) 68.2% 68.9%, transparent 69.1%),
    linear-gradient(160deg, rgba(255,255,255,.08), transparent 62%);
  transform: skewX(-9deg) rotate(-2deg);
  opacity: .72;
  filter: drop-shadow(0 18px 28px rgba(0,0,0,.22));
  animation: loginDataPulse 5.6s ease-in-out infinite;
  pointer-events: none;
}
.login-brand,
.login-copy,
.login-aside-footer {
  z-index: 2;
}
.login-copy h1 {
  text-shadow: 0 18px 46px rgba(0,0,0,.28), 0 0 32px rgba(44, 181, 166, .14);
}
.gov-badge {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 12px 28px rgba(0,0,0,.16);
}
.login-governance-panel span,
.login-capabilities span {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 10px 24px rgba(0,0,0,.13);
}
.login-stats button {
  position: relative;
  overflow: hidden;
}
.login-stats button::before {
  content: "";
  position: absolute;
  inset: -30% auto -30% -46%;
  width: 38%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
  transform: skewX(-17deg) translateX(-130%);
  animation: loginMetricSweep 7.5s ease-in-out infinite;
  pointer-events: none;
}
.login-stats button:nth-child(2)::before { animation-delay: 1.2s; }
.login-stats button:nth-child(3)::before { animation-delay: 2.4s; }
.login-card {
  overflow: hidden;
  animation: loginCardFloat 7.8s ease-in-out infinite;
}
.login-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(circle at 15% 0%, rgba(15,118,110,.08), transparent 29%),
    linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,0) 34%);
  pointer-events: none;
}
.login-card::after {
  content: "";
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -42%;
  width: 32%;
  background: linear-gradient(90deg, transparent, rgba(15,118,110,.08), rgba(226,190,112,.1), transparent);
  transform: skewX(-18deg) translateX(-130%);
  animation: loginCardSheen 8.8s ease-in-out infinite;
  pointer-events: none;
}
.login-card > * {
  position: relative;
  z-index: 1;
}
.login-card .breadcrumb {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 8px 20px rgba(15,118,110,.08);
}
.login-submit {
  box-shadow: 0 12px 28px rgba(15,118,110,.22);
}
@keyframes loginGridDrift {
  0% { background-position: 0 0, 0 0, 0 0, 0 0, 0 0; }
  100% { background-position: 96px 96px, 62px 62px, 62px 62px, 120px 0, -120px 0; }
}
@keyframes loginOrbit {
  0% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(180deg) scale(1.025); }
  100% { transform: rotate(360deg) scale(1); }
}
@keyframes loginDataPulse {
  0%, 100% { opacity: .6; filter: drop-shadow(0 18px 28px rgba(0,0,0,.2)); }
  50% { opacity: .86; filter: drop-shadow(0 22px 34px rgba(34,160,148,.22)); }
}
@keyframes loginMetricSweep {
  0%, 38% { transform: skewX(-17deg) translateX(-130%); }
  62%, 100% { transform: skewX(-17deg) translateX(520%); }
}
@keyframes loginCardSheen {
  0%, 54% { transform: skewX(-18deg) translateX(-130%); }
  78%, 100% { transform: skewX(-18deg) translateX(560%); }
}
@keyframes loginCardFloat {
  0%, 100% { transform: translateY(0); box-shadow: 0 30px 84px rgba(0,18,19,.36); }
  50% { transform: translateY(-4px); box-shadow: 0 38px 92px rgba(0,18,19,.42); }
}
@media (prefers-reduced-motion: reduce) {
  .login-screen::before,
  .login-screen::after,
  .login-aside::after,
  .login-stats button::before,
  .login-card,
  .login-card::after {
    animation: none !important;
  }
}

/* Login final art direction: shield, city, document texture, iconized cards */
.login-visual {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}
.login-cityline {
  position: absolute;
  left: 44px;
  right: 42%;
  bottom: 0;
  height: 188px;
  opacity: .38;
  background:
    linear-gradient(180deg, transparent, rgba(0, 20, 22, .36) 74%, rgba(0, 18, 19, .66)),
    linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px) 0 0 / 34px 34px;
  -webkit-mask: linear-gradient(0deg, #000 0 72%, transparent 100%);
  mask: linear-gradient(0deg, #000 0 72%, transparent 100%);
}
.login-cityline span {
  position: absolute;
  bottom: 0;
  width: 56px;
  border: 1px solid rgba(202, 224, 218, .18);
  border-bottom: 0;
  background:
    repeating-linear-gradient(180deg, rgba(255,255,255,.12) 0 2px, transparent 2px 13px),
    linear-gradient(180deg, rgba(19, 115, 108, .34), rgba(2, 38, 40, .82));
}
.login-cityline span:nth-child(1) { left: 6%; height: 104px; }
.login-cityline span:nth-child(2) { left: 17%; height: 146px; width: 72px; }
.login-cityline span:nth-child(3) { left: 31%; height: 92px; width: 48px; }
.login-cityline span:nth-child(4) { left: 42%; height: 166px; width: 82px; }
.login-cityline span:nth-child(5) { left: 58%; height: 122px; width: 64px; }
.login-cityline span:nth-child(6) { left: 71%; height: 154px; width: 76px; }
.login-doc-stack {
  position: absolute;
  left: 34%;
  bottom: 22%;
  width: 244px;
  height: 172px;
  opacity: .62;
  transform: rotate(-6deg) skewX(-6deg);
}
.login-doc-stack span {
  position: absolute;
  width: 202px;
  height: 128px;
  border: 1px solid rgba(238, 213, 152, .24);
  border-radius: 9px;
  background:
    linear-gradient(90deg, rgba(255,255,255,.12) 0 1px, transparent 1px) 22px 20px / 38px 18px,
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.025)),
    rgba(9, 73, 69, .32);
  box-shadow: 0 18px 42px rgba(0,0,0,.22);
}
.login-doc-stack span:nth-child(1) { left: 0; top: 34px; }
.login-doc-stack span:nth-child(2) { left: 24px; top: 18px; opacity: .76; }
.login-doc-stack span:nth-child(3) { left: 48px; top: 0; opacity: .92; }
.login-credit-orbit {
  position: absolute;
  left: 50.8%;
  top: 21.5%;
  width: 292px;
  height: 292px;
  border-radius: 50%;
  background:
    conic-gradient(from 20deg, rgba(232, 195, 113, .08), rgba(232, 195, 113, .76) 8%, transparent 18%, rgba(45, 181, 164, .62) 35%, transparent 48%, rgba(232,195,113,.62) 66%, transparent 82%, rgba(45,181,164,.48));
  -webkit-mask: radial-gradient(circle, transparent 0 55%, #000 56% 59%, transparent 60% 67%, #000 68% 71%, transparent 72%);
  mask: radial-gradient(circle, transparent 0 55%, #000 56% 59%, transparent 60% 67%, #000 68% 71%, transparent 72%);
  opacity: .82;
  animation: loginOrbit 18s linear infinite;
}
.login-credit-shield {
  position: absolute;
  left: calc(50.8% + 92px);
  top: calc(21.5% + 82px);
  width: 108px;
  height: 126px;
  display: grid;
  place-items: center;
  color: #ffe7a9;
  font-size: 48px;
  font-weight: 900;
  text-shadow: 0 8px 28px rgba(0,0,0,.28);
  background:
    radial-gradient(circle at 50% 28%, rgba(255,255,255,.22), transparent 34%),
    linear-gradient(180deg, rgba(19, 143, 128, .96), rgba(5, 62, 61, .96));
  clip-path: polygon(50% 0, 92% 16%, 85% 72%, 50% 100%, 15% 72%, 8% 16%);
  box-shadow: 0 26px 50px rgba(0,0,0,.26), inset 0 0 0 2px rgba(255,229,169,.34);
  animation: loginShieldGlow 4.8s ease-in-out infinite;
}
.login-credit-seal {
  position: absolute;
  left: calc(50.8% + 210px);
  top: calc(21.5% + 30px);
  width: 96px;
  height: 96px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 4px;
  border: 2px solid rgba(232, 195, 113, .68);
  border-radius: 50%;
  color: #ffe0a0;
  background: rgba(5, 54, 55, .62);
  box-shadow: 0 18px 44px rgba(0,0,0,.2), inset 0 0 0 7px rgba(232,195,113,.1);
  transform: rotate(-10deg);
}
.login-credit-seal strong { font-size: 24px; line-height: 1; }
.login-credit-seal span { font-size: 12px; font-weight: 800; }
.login-light-path {
  position: absolute;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(235, 197, 114, .86), rgba(42, 187, 169, .72), transparent);
  filter: drop-shadow(0 0 10px rgba(232,195,113,.42));
  opacity: .72;
  transform-origin: left center;
  animation: loginPathPulse 4.6s ease-in-out infinite;
}
.login-light-path.path-one { left: 22%; top: 34%; width: 360px; transform: rotate(10deg); }
.login-light-path.path-two { left: 18%; top: 56%; width: 460px; transform: rotate(-7deg); animation-delay: 1.4s; }
.login-governance-panel span {
  gap: 7px;
}
.login-governance-panel i,
.login-capabilities i,
.login-stats .stat-icon {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}
.login-stats button {
  display: grid;
  grid-template-columns: 34px 1fr;
  grid-template-rows: auto auto auto;
  column-gap: 10px;
  align-items: start;
}
.login-stats .stat-icon {
  grid-row: 1 / 4;
  width: 28px;
  height: 28px;
  padding: 6px;
  border-radius: 9px;
  color: #ffe2a3;
  background: rgba(232, 195, 113, .13);
  box-shadow: inset 0 0 0 1px rgba(232,195,113,.24);
}
.login-stats span,
.login-stats strong,
.login-stats em {
  grid-column: 2;
}
.login-capabilities span {
  display: grid;
  grid-template-columns: 28px auto;
  grid-template-rows: auto auto;
  column-gap: 9px;
  min-height: 50px;
  padding: 8px 12px;
  align-items: center;
  justify-content: start;
  border-radius: 12px;
}
.login-capabilities i {
  grid-row: 1 / 3;
  width: 18px;
  height: 18px;
  color: #ffe1a0;
}
.login-capabilities strong {
  color: rgba(255,255,255,.95);
  font-size: 12px;
  line-height: 1.1;
}
.login-capabilities em {
  color: rgba(235,247,243,.68);
  font-size: 11px;
  font-style: normal;
  line-height: 1.15;
}
.login-input-shell {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  min-height: 48px;
  border: 1px solid #d7e6e2;
  border-radius: 10px;
  background: #fbfdfc;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88);
}
.login-input-shell > i {
  width: 18px;
  height: 18px;
  justify-self: center;
  color: #0f766e;
}
.login-input-shell select,
.login-input-shell input {
  width: 100%;
  height: 46px;
  border: 0 !important;
  background: transparent !important;
  padding: 0 12px 0 0 !important;
  box-shadow: none !important;
}
.password-wrap.login-input-shell {
  grid-template-columns: 42px minmax(0, 1fr) 48px;
  gap: 0;
}
.password-wrap.login-input-shell .password-toggle {
  width: 42px;
  height: 42px;
  margin-right: 3px;
  border: 0;
  background: transparent;
}
.login-input-shell:focus-within {
  border-color: #0f766e;
  box-shadow: 0 0 0 3px rgba(15,118,110,.12), inset 0 1px 0 rgba(255,255,255,.88);
}
.login-card h2::after {
  content: "";
  display: block;
  width: 54px;
  height: 3px;
  margin-top: 14px;
  border-radius: 999px;
  background: linear-gradient(90deg, #0f766e, #d5a85b);
}
.login-org {
  position: relative;
  margin-top: 26px;
  padding-top: 18px;
  border-width: 0;
  border-top: 1px solid #e1ebe8;
  border-radius: 0;
  background: transparent;
}
@keyframes loginShieldGlow {
  0%, 100% { filter: drop-shadow(0 18px 28px rgba(12, 125, 114, .16)); }
  50% { filter: drop-shadow(0 22px 42px rgba(232, 195, 113, .2)); }
}
@keyframes loginPathPulse {
  0%, 100% { opacity: .34; background-position: 0 0; }
  50% { opacity: .86; background-position: 180px 0; }
}
@media (max-width: 1180px) {
  .login-visual {
    opacity: .48;
  }
  .login-credit-orbit,
  .login-credit-shield,
  .login-credit-seal {
    transform: scale(.82);
    transform-origin: center;
  }
}
@media (max-width: 680px) {
  .login-visual {
    display: none;
  }
  .login-capabilities span {
    flex: 1 1 150px;
  }
}

/* Login detail corrections requested by user */
.login-copy {
  margin-top: 16vh;
}
.login-copy h1 {
  margin-top: 0;
  font-size: clamp(50px, 5.2vw, 74px);
  letter-spacing: .01em;
}
.login-brand strong {
  font-size: 19px;
}
.login-brand span {
  font-size: 13px;
}
.login-governance-panel {
  margin-top: 34px;
}
.login-governance-panel span {
  min-height: 34px;
  padding: 6px 15px;
  font-size: 13px;
}
.login-credit-seal {
  display: none !important;
}
.login-capabilities {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.login-capabilities span {
  grid-template-columns: 30px minmax(0, 1fr);
  min-height: 62px;
  width: 100%;
  padding: 10px 12px;
  align-items: center;
  justify-content: start;
}
.login-capabilities i {
  justify-self: center;
}
.login-capabilities strong,
.login-capabilities em {
  min-width: 0;
  text-align: left;
  white-space: nowrap;
}
.login-capabilities strong {
  font-size: 13px;
}
.login-capabilities em {
  margin-top: 2px;
  font-size: 11.5px;
}
.login-card {
  padding-top: 52px;
}
.login-card .breadcrumb {
  display: flex;
  width: max-content;
  margin: 0 auto;
  font-size: 12.5px;
}
.login-card h2,
.login-card p {
  text-align: center;
}
.login-card h2 {
  margin-top: 24px;
  font-size: 38px;
}
.login-card h2::after {
  margin-left: auto;
  margin-right: auto;
}
.login-card p {
  margin-top: 12px;
  font-size: 16px;
}
.login-field {
  margin-top: 25px;
  font-size: 14px;
}
.login-input-shell {
  grid-template-columns: 50px minmax(0, 1fr) auto;
  min-height: 52px;
  padding-left: 4px;
}
.login-input-shell > i {
  width: 20px;
  height: 20px;
}
.login-input-shell select,
.login-input-shell input {
  height: 50px;
  padding-right: 16px !important;
  font-size: 14px;
}
.password-wrap.login-input-shell {
  grid-template-columns: 50px minmax(0, 1fr) 54px;
}
.password-wrap.login-input-shell .password-toggle {
  width: 48px;
  height: 48px;
  margin-right: 4px;
}
.login-options {
  font-size: 13px;
}
.login-submit {
  min-height: 54px;
  margin-top: 26px;
  font-size: 17px;
  gap: 10px;
}
.login-submit i {
  width: 22px;
  height: 22px;
}
.login-org {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  margin-top: 24px;
  padding: 18px 0 0;
  border-top: 1px solid #e0ebe8;
}
.login-org span {
  color: #6a7f84;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}
.login-org strong {
  color: #18383d;
  font-size: 14px;
  line-height: 1.4;
}
@media (max-width: 1180px) {
  .login-copy {
    margin-top: 54px;
  }
  .login-capabilities {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  .login-copy h1 {
    font-size: 40px;
  }
  .login-capabilities {
    grid-template-columns: 1fr;
  }
  .login-card h2 {
    font-size: 32px;
  }
  .login-org {
    grid-template-columns: 1fr;
    gap: 6px;
  }
}

/* Login refinements: static card text, clearer shield, compact labels */
.login-copy h1 {
  color: #e7c987;
  text-shadow: 0 16px 42px rgba(0,0,0,.26), 0 0 24px rgba(231,201,135,.13);
}
.login-credit-shield {
  left: calc(50.8% + 154px);
  top: calc(21.5% + 118px);
  width: 96px;
  height: 112px;
  font-size: 42px;
  z-index: 1;
}
.login-credit-orbit {
  left: 55.5%;
  top: 28%;
  width: 250px;
  height: 250px;
  opacity: .68;
}
.login-light-path.path-one { left: 18%; top: 39%; width: 332px; }
.login-light-path.path-two { left: 16%; top: 58%; width: 418px; }
.login-card,
.login-card::after {
  animation: none !important;
}
.login-card::after {
  display: none;
}
.login-card {
  transform: none !important;
}
.login-stats button {
  min-height: 92px;
  grid-template-rows: auto auto;
  align-content: center;
  row-gap: 6px;
}
.login-stats button .stat-icon {
  grid-row: 1 / 3;
  align-self: center;
}
.login-stats span {
  font-size: 13px;
}
.login-stats strong {
  margin-top: 0;
  font-size: 34px;
}
.login-stats em {
  display: none !important;
}
.login-capabilities {
  align-items: stretch;
}
.login-capabilities span {
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-rows: auto auto;
  min-height: 66px;
  padding: 9px 10px;
  gap: 2px 8px;
  overflow: hidden;
}
.login-capabilities i {
  width: 17px;
  height: 17px;
}
.login-capabilities strong,
.login-capabilities em {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: keep-all;
}
.login-capabilities strong {
  font-size: 12.5px;
}
.login-capabilities em {
  font-size: 10.5px;
  line-height: 1.25;
}
.login-input-shell {
  grid-template-columns: 56px minmax(0, 1fr) auto;
  padding-left: 2px;
}
.password-wrap.login-input-shell {
  grid-template-columns: 56px minmax(0, 1fr) 54px;
}
.login-input-shell > i {
  width: 21px;
  height: 21px;
  margin-left: 4px;
}
.login-input-shell select,
.login-input-shell input {
  padding-left: 2px !important;
}
.login-org span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.login-org span i {
  width: 15px;
  height: 15px;
  color: #0f766e;
}
@media (max-width: 1360px) {
  .login-capabilities strong { font-size: 12px; }
  .login-capabilities em { font-size: 10px; }
  .login-capabilities span { padding-inline: 9px; }
}
@media (max-width: 1180px) {
  .login-credit-shield,
  .login-credit-orbit {
    transform: scale(.82);
  }
}
@media (max-width: 680px) {
  .login-capabilities strong { font-size: 13px; }
  .login-capabilities em { font-size: 11.5px; }
}

/* Shield placement correction */
.login-credit-shield {
  left: calc(50.8% + 170px);
  top: calc(21.5% - 42px);
}
.login-credit-orbit {
  left: 56.5%;
  top: 10.5%;
}

/* Login capability simplification and shield centering */
.login-credit-shield {
  left: calc(56.5% + 77px);
  top: calc(10.5% + 69px);
}
.login-capabilities span {
  grid-template-columns: 30px minmax(0, 1fr);
  grid-template-rows: 1fr;
  min-height: 56px;
  align-content: center;
}
.login-capabilities i {
  grid-row: 1;
}
.login-capabilities strong {
  align-self: center;
  font-size: 13px;
}
.login-capabilities em {
  display: none !important;
}
@media (max-width: 1360px) {
  .login-capabilities span {
    min-height: 56px;
  }
}

/* Place shield in the largest background ring and enlarge bottom capability labels */
.login-credit-shield {
  left: calc(31.5% + 212px);
  top: calc(19% + 204px);
}
.login-capabilities strong {
  font-size: 15px;
  font-weight: 900;
}
.login-capabilities span {
  min-height: 58px;
}
@media (max-width: 1360px) {
  .login-capabilities strong {
    font-size: 14px;
  }
}
@media (max-width: 680px) {
  .login-capabilities strong {
    font-size: 15px;
  }
}

/* Login skyline enhancement and largest-ring shield alignment */
.login-credit-shield {
  left: calc(31.5vw + 212px);
  top: calc(19% + 204px);
}
.login-cityline {
  left: 28px;
  right: 34%;
  height: 276px;
  opacity: .64;
  background:
    linear-gradient(180deg, transparent 0 18%, rgba(4, 45, 47, .18) 42%, rgba(0, 18, 19, .72) 100%),
    linear-gradient(90deg, rgba(255,255,255,.075) 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(0deg, rgba(255,255,255,.055) 1px, transparent 1px) 0 0 / 28px 28px;
  -webkit-mask: linear-gradient(0deg, #000 0 86%, transparent 100%);
  mask: linear-gradient(0deg, #000 0 86%, transparent 100%);
}
.login-cityline::before,
.login-cityline::after {
  content: "";
  position: absolute;
  bottom: 0;
  display: block;
  border: 1px solid rgba(210, 228, 222, .16);
  border-bottom: 0;
  background:
    repeating-linear-gradient(180deg, rgba(232, 246, 241, .13) 0 2px, transparent 2px 14px),
    repeating-linear-gradient(90deg, rgba(232, 246, 241, .1) 0 2px, transparent 2px 18px),
    linear-gradient(180deg, rgba(18, 116, 108, .44), rgba(1, 37, 39, .9));
  box-shadow: 0 22px 54px rgba(0,0,0,.24);
}
.login-cityline::before {
  left: 79%;
  width: 92px;
  height: 238px;
  clip-path: polygon(0 12%, 42% 12%, 42% 0, 58% 0, 58% 12%, 100% 12%, 100% 100%, 0 100%);
}
.login-cityline::after {
  left: 90%;
  width: 68px;
  height: 198px;
  clip-path: polygon(0 18%, 50% 0, 100% 18%, 100% 100%, 0 100%);
  opacity: .82;
}
.login-cityline span {
  border-color: rgba(210, 228, 222, .18);
  background:
    repeating-linear-gradient(180deg, rgba(236,247,243,.14) 0 2px, transparent 2px 15px),
    repeating-linear-gradient(90deg, rgba(236,247,243,.1) 0 2px, transparent 2px 17px),
    linear-gradient(180deg, rgba(18, 112, 105, .46), rgba(1, 34, 36, .92));
  box-shadow: 0 22px 50px rgba(0,0,0,.22);
}
.login-cityline span:nth-child(1) { left: 3%; height: 132px; width: 62px; }
.login-cityline span:nth-child(2) { left: 13%; height: 218px; width: 86px; }
.login-cityline span:nth-child(3) { left: 27%; height: 156px; width: 56px; }
.login-cityline span:nth-child(4) { left: 38%; height: 252px; width: 96px; }
.login-cityline span:nth-child(5) { left: 54%; height: 178px; width: 76px; }
.login-cityline span:nth-child(6) { left: 66%; height: 226px; width: 88px; }
@media (max-width: 1180px) {
  .login-credit-shield {
    left: calc(31.5vw + 212px);
  }
}

/* Brighten login platform title */
.login-copy h1 {
  color: #ffd66f;
  background: linear-gradient(180deg, #fff2bc 0%, #ffd66f 45%, #e5b653 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 18px 46px rgba(0,0,0,.28), 0 0 30px rgba(255, 214, 111, .2);
}

/* Login footer reference style: glass metric cards and compact capability notes */
.login-aside-footer {
  max-width: 760px;
  gap: 34px;
}
.login-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.login-stats button {
  min-height: 86px;
  display: grid;
  grid-template-columns: 54px auto minmax(20px, 1fr);
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 10px;
  row-gap: 2px;
  padding: 17px 20px;
  border: 1px solid rgba(186, 230, 222, .22);
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(23, 103, 95, .56), rgba(8, 71, 68, .42));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 34px rgba(0,0,0,.18);
  backdrop-filter: blur(12px);
}
.login-stats .stat-icon {
  grid-row: 1 / 3;
  grid-column: 1;
  width: 38px;
  height: 38px;
  padding: 7px;
  align-self: center;
  color: #f2d390;
  background: transparent;
  box-shadow: none;
  stroke-width: 1.8;
}
.login-stats span {
  grid-column: 2 / 4;
  grid-row: 1;
  align-self: end;
  color: rgba(245,250,248,.9);
  font-size: 15px;
  font-weight: 800;
}
.login-stats strong {
  grid-column: 2;
  grid-row: 2;
  margin: 0;
  color: #f2c77d;
  font-size: 34px;
  line-height: .98;
  font-weight: 900;
  text-shadow: 0 6px 18px rgba(242,199,125,.18);
}
.login-stats small {
  grid-column: 3;
  grid-row: 2;
  align-self: end;
  margin-bottom: 4px;
  color: rgba(245,232,197,.86);
  font-size: 13px;
  font-weight: 700;
}
.login-capabilities {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  align-items: start;
}
.login-capabilities span {
  min-height: 52px;
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: start;
  align-items: start;
  gap: 3px 8px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}
.login-capabilities i {
  grid-row: 1 / 3;
  grid-column: 1;
  width: 18px;
  height: 18px;
  padding: 3px;
  justify-self: start;
  color: #f2c77d;
  border: 1px solid rgba(242,199,125,.55);
  border-radius: 5px;
  background: rgba(8, 72, 68, .38);
  stroke-width: 1.8;
}
.login-capabilities strong {
  grid-column: 2;
  color: rgba(246,251,249,.92);
  font-size: 13px;
  line-height: 1.08;
  font-weight: 850;
  white-space: nowrap;
}
.login-capabilities em {
  display: block !important;
  grid-column: 2;
  color: rgba(211, 229, 224, .72);
  font-size: 10.5px;
  line-height: 1.25;
  font-style: normal;
  white-space: nowrap;
}
@media (max-width: 1360px) {
  .login-stats { gap: 16px; }
  .login-stats button { padding: 16px 17px; }
  .login-stats span { font-size: 14px; }
  .login-stats strong { font-size: 32px; }
  .login-capabilities { gap: 16px; }
  .login-capabilities strong { font-size: 12.5px; }
  .login-capabilities em { font-size: 10px; }
}
@media (max-width: 680px) {
  .login-aside-footer { gap: 22px; }
  .login-stats { grid-template-columns: 1fr; }
  .login-capabilities { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 18px; }
  .login-capabilities em { white-space: normal; }
}
.login-stats button::before {
  display: none !important;
}

/* Enlarge centered credit shield */
.login-credit-shield {
  left: calc(31.5vw + 196px);
  top: calc(19% + 185px);
  width: 128px;
  height: 150px;
  font-size: 56px;
}

/* Lower login title group slightly */
.login-copy {
  margin-top: 20vh;
}
@media (max-width: 1360px) {
  .login-copy {
    margin-top: 19vh;
  }
}
@media (max-width: 1180px) {
  .login-copy {
    margin-top: 64px;
  }
}
