/* MarginLens V42: presentation only. Reporting JS, ids, views and filter logic unchanged. */
:root{--v42-navy:#102839;--v42-teal:#117e79;--v42-bg:#f7f6f1;--v42-line:#e5e7e3}
body{background:var(--v42-bg)}
.demo-hero{background:#122b3b;color:#f5f3eb;padding:29px 0 26px;border-bottom:4px solid #d9ae94}
.demo-hero .eyebrow{color:#9cdbce}.demo-hero .muted{color:#c4d5d9}
.nav{background:#fcfaf5;border-bottom:1px solid #e1e4df}.nav .wrap{max-width:1500px}
.demo-layout{max-width:1500px;display:grid;grid-template-columns:218px minmax(0,1fr);column-gap:24px;row-gap:18px;align-items:start;padding-top:26px}
.demo-layout>.card:first-child{grid-column:2;grid-row:1;border-radius:17px;padding:18px 20px;background:#fff;box-shadow:0 5px 22px #14354c0a}
.demo-layout>.report-nav{grid-column:1;grid-row:1/span 12;position:sticky;top:96px;z-index:24;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:5px!important;margin:0!important;padding:15px 10px!important;background:var(--v42-navy)!important;border:1px solid #234054!important;border-radius:18px!important;box-shadow:0 12px 35px #09233318!important;min-height:460px}
.rail-heading{display:flex;align-items:center;gap:12px;color:#e9f3ed;font-size:11px;font-weight:850;letter-spacing:.12em;padding:13px 11px 22px;border-bottom:1px solid #385368;margin-bottom:13px}
.rail-mark{display:grid;place-items:center;width:35px;height:35px;flex-shrink:0;background:#a3ddcd;color:#102b3c;border-radius:11px;font-family:Georgia,serif;font-weight:bold;font-size:24px}
.rail-heading small{display:block;font-size:11px;font-weight:450;letter-spacing:0;color:#9db6bf;margin-top:4px}
.demo-layout .report-nav .report-home,.demo-layout .report-nav .report-menu>summary{display:flex!important;width:100%!important;justify-content:space-between!important;padding:13px 14px!important;color:#c3d3db!important;background:transparent!important;font-weight:650!important;border-radius:9px!important;font-size:13px!important}
.demo-layout .report-nav .report-home[aria-current=page],.demo-layout .report-nav .report-menu.active>summary,.demo-layout .report-nav .report-menu[open]>summary{background:#274d5a!important;color:#fff!important;box-shadow:none!important}
.demo-layout .report-nav .report-menu{width:100%!important}
.demo-layout .report-nav .report-menu-items{position:static!important;min-width:0!important;border:0!important;background:#193747!important;box-shadow:none!important;border-radius:10px!important;margin:3px 0 7px!important;padding:5px!important}
.demo-layout .report-nav .report-menu-items button{color:#cad9dd!important;font-weight:550!important;font-size:12px!important;padding:11px 12px!important}
.demo-layout .report-nav .report-menu-items button:hover,.demo-layout .report-nav .report-menu-items button[aria-current=page]{color:#fff!important;background:#2b5860!important}
.demo-layout>.view,.demo-layout>.center{grid-column:2;min-width:0}
.demo-layout .card{border-color:var(--v42-line);box-shadow:0 6px 25px #0e30400a;border-radius:17px}
.dashboard-intro{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:1px 0 20px;padding:5px 2px}
.dashboard-intro h2{font:normal clamp(27px,3.3vw,40px)/1.1 Georgia,'Times New Roman',serif;letter-spacing:-.035em;margin:7px 0;color:#122b3b}
.dashboard-intro p{font-size:14px;color:#607382;margin:0}.dashboard-kicker{font-size:10px;letter-spacing:.16em;font-weight:850;color:#198277}
.dashboard-cta{background:#153a46;color:white;text-decoration:none;padding:12px 16px;border-radius:11px;font-size:12px;font-weight:750;white-space:nowrap}
#overview #summary{gap:12px;margin:0 0 18px}
#overview #summary .kpi,#overview #healthDashboard .kpi{background:#f6f8f7;border:1px solid #ebefed;border-radius:11px;padding:18px}
#overview #summary .kpi b,#overview #healthDashboard .kpi b{font-size:clamp(19px,2.2vw,27px);letter-spacing:-.03em;color:#183346}
#overview #healthDashboard{background:#fff;margin-bottom:18px!important}
#overview .grid2{align-items:stretch}
#overview .grid2>.card{min-height:280px}
#overview .card h3{color:#182f40;font-size:17px}
#overview .pill{border-radius:999px}
#overview #salesChart{padding:8px 0}
.demo-layout .tablewrap{max-width:100%}
@media(min-width:1000px){.demo-layout>.view .grid4{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:900px){.demo-layout{display:flex;flex-direction:column;gap:16px}.demo-layout>.card:first-child,.demo-layout>.view,.demo-layout>.center,.demo-layout>.report-nav{width:100%}.demo-layout>.report-nav{position:static;min-height:0;display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;padding:8px!important;border-radius:13px!important}.rail-heading{display:none}.demo-layout .report-nav .report-home,.demo-layout .report-nav .report-menu>summary{padding:11px 12px!important}.demo-layout .report-nav .report-menu{width:auto!important}.demo-layout .report-nav .report-menu-items{position:absolute!important;min-width:180px!important;background:#193747!important;box-shadow:0 15px 35px #10202a30!important;z-index:30}}
@media(max-width:560px){.demo-hero{padding:28px 0 22px}.dashboard-cta{display:none}.demo-layout{padding-top:15px}.demo-layout>.card:first-child{padding:16px}.dashboard-intro h2{font-size:30px}#overview #summary .kpi{padding:13px}}

/* V43: uncluttered rail and centrally aligned numerical columns */
@media(min-width:901px){
 .demo-layout>.report-nav{min-height:0!important}
}
.demo-layout .view .tablewrap th.num,
.demo-layout .view .tablewrap td.num{
 text-align:center!important;
 font-variant-numeric:tabular-nums;
}
.demo-layout .view .tablewrap th.num .sort-head{
 justify-content:center!important;
 text-align:center!important;
}
.demo-layout .view .tablewrap th.num .sort-label{text-align:center!important;}
/* Data cells are sometimes generated using numeric source values without a num class.
   Match those columns to their numeric headers rather than shifting text columns. */
.demo-layout #opportunities .tablewrap th:nth-child(3),
.demo-layout #opportunities .tablewrap th:nth-child(4),
.demo-layout #opportunities .tablewrap td:nth-child(3),
.demo-layout #opportunities .tablewrap td:nth-child(4){text-align:center!important;}
.demo-layout #opportunities .tablewrap th:nth-child(3) .sort-head,
.demo-layout #opportunities .tablewrap th:nth-child(4) .sort-head{justify-content:center!important;}

/* V48: persistent desktop sidebar; mobile menu is collapsed by default. */
.mobile-reports-toggle{display:none}
@media(max-width:900px){
 .mobile-reports-toggle{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:13px 18px;border:1px solid #294b59;border-radius:12px;background:#102839;color:#fff;font:750 14px system-ui;cursor:pointer}
 .demo-layout>.report-nav{display:none!important;min-height:0!important;max-width:100%;width:100%!important;flex-direction:column!important;align-items:stretch!important;gap:4px!important}
 .demo-layout>.report-nav.mobile-open{display:flex!important}
 .demo-layout .report-nav .report-menu{width:100%!important}
 .demo-layout .report-nav .report-menu-items{position:static!important;width:100%!important;box-shadow:none!important}
}
@media(min-width:901px){.demo-layout>.report-nav{display:flex!important}.mobile-reports-toggle{display:none!important}}


/* V51: real, data-driven analytics on the overview and in the homepage preview. */
.analytics-visuals{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr) minmax(0,1fr);gap:13px;margin-bottom:16px}
.analytics-visuals>.card{min-width:0;padding:19px 17px;background:#fff}
.analytics-visuals .cardhead{align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:13px}
.analytics-visuals .cardhead h3{font-size:15px!important;margin:0}
.analytics-visuals .cardhead .pill{font-size:10px;white-space:nowrap}
.analytics-visuals .chart{width:100%;height:auto;display:block;overflow:visible}
.chart-legend{display:flex;align-items:center;gap:15px;font-size:12px;font-weight:650;color:#526b77;margin:0 0 7px}
.chart-legend span{display:inline-flex;align-items:center;gap:6px}
.swatch-chart{display:inline-block;width:11px;height:11px;border-radius:3px}
.sales-swatch{background:#244c61}.gp-swatch{background:#23b49d}
.chart-subtitle{font-size:12px;color:#6d7f88;line-height:1.5;margin:0 0 9px;min-height:36px}
.customer-bar-item{margin:13px 0}
.customer-bar-title{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:12px;margin-bottom:6px;min-width:0}
.customer-bar-title .customer-link{max-width:68%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;font-size:12px;min-width:0}
.customer-bar-title strong{font-size:12px;color:#234456;font-variant-numeric:tabular-nums;white-space:nowrap}
.customer-bar-track{height:12px;border-radius:7px;background:#e9f1f0;overflow:hidden}
.customer-bar-fill{height:100%;border-radius:7px;background:linear-gradient(90deg,#89d6c4,#178c80)}
.overview-insights{margin-bottom:18px}
#overview #summary{margin:0 0 16px}
#overview #summary .kpi{padding:16px 17px}
@media(min-width:1000px) and (max-width:1250px){.analytics-visuals{grid-template-columns:repeat(2,minmax(0,1fr))}.chart-cvg{grid-column:1 / -1}}
@media(max-width:740px){.analytics-visuals{grid-template-columns:1fr}.chart-cvg{grid-column:auto}.analytics-visuals .cardhead h3{font-size:16px!important}}

/* Hero iframe only: live overview, with explanatory copy and controls hidden to
   make the honest product preview show data within the computer screen. */
body.hero-preview{background:#f5f8f7;min-width:1120px}
body.hero-preview .nav,body.hero-preview .demo-hero,body.hero-preview .footer,
body.hero-preview .mobile-reports-toggle,body.hero-preview .demo-layout>.card:first-child,
body.hero-preview #overview .dashboard-intro,body.hero-preview #overview .overview-insights,
body.hero-preview #overview #healthDashboard,body.hero-preview #overview .overview-history{display:none!important}
body.hero-preview .demo-layout{max-width:none;width:100%;margin:0;padding:14px 20px 26px;display:grid;grid-template-columns:188px minmax(0,1fr);align-items:start;gap:14px}
body.hero-preview .demo-layout>.report-nav{grid-column:1!important;grid-row:1/span 8!important;top:0!important;position:relative!important;min-height:520px!important;padding-top:22px!important}
body.hero-preview .demo-layout>.view#overview{grid-column:2;grid-row:1;min-width:0;padding:0}
body.hero-preview #overview::before{content:"MARGINLENS · LIVE SAMPLE DASHBOARD";display:block;letter-spacing:.15em;color:#248d80;font:800 11px system-ui;margin:1px 0 10px}
body.hero-preview #overview #summary{margin:0 0 14px;grid-template-columns:repeat(4,minmax(0,1fr))}
body.hero-preview #overview #summary .kpi{padding:12px 13px}
body.hero-preview #overview #summary .kpi b{font-size:24px}
body.hero-preview #overview #summary .site-note{font-size:10px}
body.hero-preview .analytics-visuals{display:grid;grid-template-columns:1.12fr 1fr 1fr;gap:12px}
body.hero-preview .analytics-visuals .card{padding:15px 13px}
body.hero-preview .analytics-visuals .chart-subtitle{min-height:32px;font-size:11px}
body.hero-preview .customer-bar-item{margin:11px 0}
body.hero-preview #overview .chart-panel{min-height:294px}
body.hero-preview .chart-legend{font-size:11px}