:root {
  --rbi-yellow: #FFDD00;
  --text-main: #101418;
  --text-muted: #6B7280;
  --border-light: #E8EBEF;
  --bg-soft: #F7F8FA;
  --card-bg: #FFFFFF;
  --success: #16A34A;
  --warning: #F59E0B;
  --danger: #DC2626;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: var(--text-main); background: #fff; }
.app-shell { min-height: 100vh; background: var(--bg-soft); }
.app-header { display:flex; gap:24px; justify-content:space-between; align-items:center; padding:16px 32px; background:#fff; border-bottom:1px solid var(--border-light); }
.brand-caption { margin:0; color:var(--text-muted); font-size:12px; }
.brand-block h1 { margin:2px 0 0; font-size:20px; }
.main-nav { display:flex; gap:10px; }
.nav-item { text-decoration:none; color:var(--text-main); padding:10px 12px; border-radius:10px; }
.nav-item.active, .nav-item:hover { background: var(--rbi-yellow); }
.header-tools { display:flex; align-items:center; gap:10px; }
.icon-btn { border:1px solid var(--border-light); border-radius:50%; width:32px; height:32px; background:#fff; }
.avatar { width:32px; height:32px; border-radius:50%; background:var(--text-main); color:#fff; display:grid; place-items:center; font-size:12px; }
.logout-link { color: var(--text-main); }
.app-main { padding: 28px 32px; display:grid; gap:18px; }
.app-footer { padding: 14px 32px; color: var(--text-muted); font-size: 13px; }
.hero-block { background:var(--card-bg); border:1px solid var(--border-light); border-radius:16px; padding:24px; box-shadow: 0 8px 25px rgba(0,0,0,.04); }
.hero-block h2 { margin:0 0 8px; font-size:36px; }
.hl { background: var(--rbi-yellow); padding: 0 6px; border-radius: 6px; }
.card-grid { display:grid; gap:16px; }
.card-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.card-grid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.card { background: var(--card-bg); border:1px solid var(--border-light); border-radius: 14px; padding:18px; box-shadow: 0 6px 18px rgba(0,0,0,.04); }
.kpi-value { font-size: 30px; margin: 6px 0 0; }
.upload-card { min-height: 160px; }
.placeholder-box { border:2px dashed var(--border-light); border-radius:10px; padding:26px; color: var(--text-muted); background:#FCFCFD; }
.placeholder-box.large { min-height: 200px; display:grid; place-items:center; }
.form-input { width:100%; margin-top:6px; border:1px solid var(--border-light); border-radius:10px; padding:10px 12px; }
.filter-panel { max-width: 460px; }
.btn { border:none; border-radius:10px; padding:10px 14px; cursor:pointer; font-weight:600; }
.btn-primary { background:var(--rbi-yellow); color:#000; }
.btn-secondary { background:#fff; border:1px solid var(--border-light); color:var(--text-muted); }
.login-shell { min-height:100vh; display:grid; place-items:center; background: linear-gradient(#fff, #fefdf3); }
.login-card { width: 420px; background:#fff; border:1px solid var(--border-light); border-radius:16px; padding:24px; box-shadow: 0 14px 34px rgba(0,0,0,.08); }
.muted { color: var(--text-muted); }
.form-stack { display:grid; gap:12px; }
.alert { padding:10px; border-radius:8px; margin:10px 0; font-size:14px; }
.alert.danger { background:#fef2f2; color:var(--danger); border:1px solid #fecaca; }
.alert.warning { background:#fffbeb; color:#92400e; border:1px solid #fde68a; }
@media (max-width: 980px) { .card-grid.three, .card-grid.four { grid-template-columns: 1fr; } .app-header { flex-direction:column; align-items:flex-start; } }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; font-size:14px; }
th, td { border-bottom:1px solid var(--border-light); text-align:left; padding:8px; vertical-align:top; }
th { background:#fafafa; }
textarea.form-input { min-height:90px; }

.filter-grid { display:grid; gap:12px; grid-template-columns: repeat(4,minmax(0,1fr)); }
.funnel-row{display:grid;grid-template-columns:280px 1fr auto;gap:12px;align-items:center;margin:8px 0;}
.funnel-bar{height:10px;background:#f1f5f9;border-radius:10px;overflow:hidden;}
.funnel-bar span{display:block;height:100%;background:var(--rbi-yellow);} 
@media (max-width:980px){.filter-grid{grid-template-columns:1fr}.funnel-row{grid-template-columns:1fr;}}
.card-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.chart-card-head { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.chart-actions { display:flex; gap:8px; flex-wrap:wrap; }
.chart-box { height: 280px; margin-top: 10px; }
.chart-subtitle { margin-top: 6px; font-size: 13px; }
.insight-list { display:grid; gap:10px; }
.insight-item { border:1px solid var(--border-light); border-radius:10px; padding:12px; display:flex; justify-content:space-between; gap:12px; }
.insight-item h4 { margin: 4px 0; }
.insight-badge { background:#f3f4f6; border-radius:999px; padding:6px 10px; height:fit-content; font-size:12px; }
@media (max-width:980px){.card-grid.two{grid-template-columns:1fr}.chart-card-head{flex-direction:column;align-items:flex-start}}

/* Modern dashboard polish */
:root {
  --rbi-yellow: #FFD200;
  --rbi-yellow-soft: #FFF5B8;
  --ink: #0B0F16;
  --shadow-soft: 0 18px 48px rgba(15, 23, 42, .07);
  --radius-lg: 22px;
  --radius-md: 16px;
}
body { background:#fff; color:var(--ink); }
.app-shell { background:linear-gradient(180deg,#fff 0%,#fafafa 45%,#fff 100%); }
.app-header { position:sticky; top:0; z-index:10; padding:18px 34px; border-bottom:1px solid #EDF0F3; box-shadow:0 1px 0 rgba(15,23,42,.02); }
.brand-block { display:flex; align-items:center; gap:14px; min-width:300px; }
.brand-mark { width:34px; height:34px; display:grid; place-items:center; border-radius:8px; background:var(--rbi-yellow); font-weight:900; color:#111; }
.brand-caption { color:#111827; font-weight:800; line-height:1.05; font-size:13px; }
.brand-block h1 { color:#4B5563; font-size:14px; font-weight:500; margin-top:4px; }
.main-nav { background:#F7F8FA; padding:4px; border-radius:999px; border:1px solid #EEF0F3; }
.nav-item { color:#4B5563; font-size:13px; padding:8px 13px; border-radius:999px; }
.nav-item.active, .nav-item:hover { background:#fff; box-shadow:0 6px 16px rgba(15,23,42,.08); color:#111; }
.icon-btn { border:0; background:#F8FAFC; color:#374151; }
.avatar { background:#F3F4F6; color:#111; font-weight:700; }
.logout-link { color:#6B7280; font-size:13px; }
.app-main { max-width:1280px; width:100%; margin:0 auto; padding:34px 44px 28px; gap:20px; }
.app-footer { max-width:1280px; margin:0 auto; width:100%; display:flex; justify-content:space-between; border-top:1px solid #EEF0F3; padding:22px 44px 34px; }
.app-footer a { color:#2563EB; text-decoration:none; font-weight:600; }
.hero-block { border:0; box-shadow:none; padding:8px 0 2px; background:transparent; }
.hero-minimal h2 { font-size:48px; line-height:.98; letter-spacing:-.055em; max-width:680px; }
.hero-minimal p { margin:14px 0 0; color:#4B5563; font-size:16px; }
.hl { border-radius:4px; padding:0 7px 2px; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.card { border:1px solid #E7EAF0; border-radius:var(--radius-lg); box-shadow:var(--shadow-soft); padding:22px; }
.card h3 { margin:0; font-size:18px; letter-spacing:-.02em; }
.card p { line-height:1.55; }
.filter-card { box-shadow:0 12px 34px rgba(15,23,42,.05); }
.filter-grid { grid-template-columns: repeat(4,minmax(0,1fr)); align-items:end; }
.filter-card label { color:#374151; font-size:13px; font-weight:650; }
.form-input { min-height:43px; border-color:#E1E6EE; border-radius:12px; background:#fff; color:#111827; margin-top:7px; }
.form-input:focus { outline:3px solid rgba(255,210,0,.28); border-color:#E9BE00; }
.filter-action { display:flex; align-items:end; justify-content:flex-end; }
.btn { border-radius:999px; padding:11px 18px; font-weight:800; }
.btn-primary { background:var(--rbi-yellow); box-shadow:0 10px 22px rgba(255,210,0,.25); }
.btn-secondary { border:1px solid #E3E7ED; color:#374151; background:#fff; padding:8px 12px; font-size:12px; }
.score-panel-head, .chart-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.score-layout { display:grid; grid-template-columns: 1.1fr 2fr; gap:24px; align-items:center; margin-top:12px; }
.mini-gauge-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; }
.gauge-widget { position:relative; display:grid; place-items:center; min-height:170px; overflow:hidden; border:1px solid #E7EAF0; border-radius:20px; background:#fff; }
.gauge-large { min-height:245px; border:0; }
.gauge-arc { width:190px; aspect-ratio:2/1; position:relative; overflow:hidden; }
.gauge-large .gauge-arc { width:310px; }
.gauge-arc::before { content:""; position:absolute; inset:0; border-radius:999px 999px 0 0; background:conic-gradient(from 270deg at 50% 100%, var(--gauge-color,#FFD200) calc(var(--value)*.5%), #EDF0F3 0 50%, transparent 0); }
.gauge-arc::after { content:""; position:absolute; left:14%; right:14%; bottom:0; height:72%; background:#fff; border-radius:999px 999px 0 0; }
.gauge-content { position:absolute; inset:auto 12px 18px; text-align:center; display:grid; gap:5px; }
.gauge-content strong { font-size:34px; letter-spacing:-.04em; }
.gauge-large .gauge-content strong { font-size:52px; }
.gauge-content span { color:#111827; font-weight:700; }
.gauge-content em { font-style:normal; color:#6B7280; font-size:12px; }
.success { --gauge-color: var(--success); }
.warning { --gauge-color: var(--warning); }
.danger { --gauge-color: var(--danger); }
.neutral { --gauge-color: #9CA3AF; }
.status-pill { display:inline-flex; align-items:center; border-radius:999px; padding:6px 10px; font-size:12px; font-weight:800; background:#F3F4F6; color:#4B5563; white-space:nowrap; }
.status-pill.success { background:#EAF8EF; color:#138A3D; }
.status-pill.warning { background:#FFF2C2; color:#A16207; }
.status-pill.danger { background:#FEE2E2; color:#B91C1C; }
.status-pill.neutral { background:#F3F4F6; color:#4B5563; }
.card-grid.three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.card-grid.five { grid-template-columns: repeat(5,minmax(0,1fr)); }
.chart-box { height:300px; }
.funnel-box { height:260px; }
.compact-bars { height:270px; }
.charts-grid .card { min-width:0; }
.chart-actions { opacity:.9; }
.dashboard-table table { font-size:13px; }
th, td { padding:12px 10px; border-bottom:1px solid #EEF0F3; }
th { background:#fff; color:#667085; font-size:12px; text-transform:none; font-weight:750; }
td { color:#111827; }
.rate-emphasis { font-weight:850; color:#111; background:#FFF6BF; border-radius:999px; padding:4px 8px; }
.insights-card { background:linear-gradient(180deg,#fff,#fffdf2); }
.insight-list { gap:0; }
.insight-item { border:0; border-bottom:1px solid #EBEEF3; border-radius:0; padding:16px 0; align-items:center; }
.insight-item:last-child { border-bottom:0; }
.insight-item h4 { font-size:15px; margin:4px 0 6px; }
.insight-item p { margin:0 0 4px; }
.eyebrow { margin:0; color:#6B7280; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.insight-badge { background:#FFF2C2; color:#92400E; font-weight:800; border:1px solid #FFE08A; }
.empty-state { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.merchant-search { display:grid; grid-template-columns:1fr 1fr 1fr 2.1fr auto; gap:14px; align-items:end; }
.identity-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:26px 32px; }
.identity-grid.compact { grid-template-columns:repeat(5,minmax(0,1fr)); }
.identity-grid span { display:block; color:#667085; font-size:12px; margin-bottom:8px; }
.identity-grid strong { font-size:17px; }
.text-success { color:var(--success); }
.kpi-strip .compact-kpi { min-height:134px; display:grid; gap:8px; align-content:center; }
.compact-kpi span { color:#374151; font-weight:700; font-size:13px; }
.compact-kpi strong { font-size:31px; letter-spacing:-.04em; }
.compact-kpi em { justify-self:start; font-style:normal; }
.insight-summary { display:grid; align-content:center; gap:18px; }
.insight-summary p { font-size:16px; color:#4B5563; margin:0; }
.benchmark-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:18px; }
.benchmark-tile { border:1px solid #E7EAF0; border-radius:16px; padding:16px; background:#fff; }
.benchmark-tile h4 { margin:0 0 12px; }
.benchmark-tile dl { margin:0; display:grid; gap:10px; }
.benchmark-tile dt { color:#667085; font-size:12px; }
.benchmark-tile dd { margin:2px 0 0; font-weight:800; }
.benchmark-tile dd span { color:#667085; font-weight:500; font-size:12px; }
.quality-card { min-height:130px; display:grid; align-content:center; gap:8px; }
.quality-card span { color:#374151; font-weight:750; }
.quality-card strong { font-size:34px; }
.quality-card em { font-style:normal; font-size:12px; font-weight:800; }
.quality-card.is-clean em { color:var(--success); }
.quality-card.has-issue { border-color:#FFE08A; background:#FFFDF2; }
.quality-card.has-issue em { color:#A16207; }
.upload-form { gap:18px; }
.upload-card { border-radius:18px; box-shadow:none; background:#FFFEF7; }
@media (max-width:1100px) { .score-layout, .merchant-search { grid-template-columns:1fr; } .mini-gauge-grid, .card-grid.five, .benchmark-grid, .identity-grid, .identity-grid.compact { grid-template-columns:repeat(2,minmax(0,1fr)); } .card-grid.three { grid-template-columns:1fr; } }
@media (max-width:780px) { .app-main { padding:24px 18px; } .hero-minimal h2 { font-size:38px; } .mini-gauge-grid, .card-grid.five, .identity-grid, .identity-grid.compact { grid-template-columns:1fr; } .app-header { position:static; } .main-nav { flex-wrap:wrap; border-radius:16px; } }

/* Second polish pass: repaired widgets and custom chart components */
.brand-mark { font-size:11px; letter-spacing:.02em; }
.app-footer { align-items:center; gap:18px; }
.footer-secure { display:inline-flex; align-items:center; gap:10px; }
.footer-icon { width:22px; height:22px; display:inline-grid; place-items:center; border:1px solid #CBD5E1; border-radius:999px; color:#16A34A; font-weight:900; }
.score-layout-fixed { grid-template-columns: 320px minmax(0,1fr); align-items:stretch; }
.hero-score-card { position:relative; min-height:258px; display:grid; place-items:center; border-radius:22px; background:radial-gradient(circle at 50% 58%, #fff 0 42%, transparent 43%), linear-gradient(180deg,#fff,#fffdf4); border:1px solid #E7EAF0; overflow:hidden; }
.hero-score-gauge { position:absolute; top:34px; width:245px; height:126px; overflow:hidden; }
.hero-score-gauge::before { content:""; position:absolute; inset:0; border-radius:245px 245px 0 0; background:conic-gradient(from 270deg at 50% 100%, var(--gauge-color,#FFD200) calc(var(--value)*.5%), #EDF0F3 0 50%, transparent 0); }
.hero-score-gauge::after { content:""; position:absolute; left:16%; right:16%; bottom:0; height:68%; border-radius:200px 200px 0 0; background:#fff; }
.hero-score-content { position:relative; z-index:1; display:grid; gap:8px; justify-items:center; padding-top:64px; }
.hero-score-content strong { display:block; font-size:54px; line-height:1; letter-spacing:-.055em; }
.hero-score-content span { display:inline-flex; border-radius:999px; background:#FFF2C2; padding:6px 12px; font-weight:850; font-size:13px; }
.metric-card-grid { display:grid; grid-template-columns:repeat(5,minmax(128px,1fr)); gap:14px; }
.metric-card { min-height:160px; display:flex; flex-direction:column; justify-content:space-between; align-items:flex-start; gap:14px; padding:18px; border:1px solid #E7EAF0; border-radius:20px; background:#fff; box-shadow:0 8px 24px rgba(15,23,42,.04); }
.metric-label { display:block; min-height:20px; color:#374151; font-size:13px; font-weight:800; line-height:1.25; }
.metric-value { display:block; font-size:34px; line-height:1; letter-spacing:-.045em; color:#0B0F16; }
.metric-card .status-pill { margin-top:auto; }
.chart-box.funnel-box, .chart-box.compact-bars { display:grid; align-items:center; min-height:280px; height:auto; }
.funnel-svg, .failure-svg { width:100%; height:auto; display:block; overflow:visible; }
.funnel-label { fill:#111827; font-size:15px; font-weight:750; }
.funnel-count { fill:#111827; font-size:14px; font-weight:800; text-anchor:end; }
.funnel-percent { fill:#4B5563; font-size:13px; font-weight:800; text-anchor:end; }
.failure-rank { fill:#94A3B8; font-size:13px; font-weight:900; text-anchor:middle; }
.failure-label { fill:#111827; font-size:14px; font-weight:750; }
.failure-count { fill:#111827; font-size:13px; font-weight:850; text-anchor:end; }
.failure-percent { fill:#4B5563; font-size:13px; font-weight:850; text-anchor:end; }
.chart-empty { min-height:160px; display:grid; place-items:center; text-align:center; color:#667085; background:#F8FAFC; border:1px dashed #D9DEE7; border-radius:16px; padding:20px; }
.compact-empty { display:grid; gap:8px; }
.dashboard-table th:not(:first-child), .dashboard-table td:not(:first-child) { text-align:right; white-space:nowrap; }
.chart-actions .btn { min-height:32px; padding:7px 12px; display:inline-flex; align-items:center; }
@media (max-width:1100px) { .score-layout-fixed { grid-template-columns:1fr; } .metric-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:620px) { .metric-card-grid { grid-template-columns:1fr; } .metric-card { min-height:126px; } .hero-score-content strong { font-size:44px; } }
