.dashboard-page{background:var(--navy);color:#fff}
.dashboard-page main{background:radial-gradient(circle at 70% 15%,rgba(14,83,168,.16),transparent 28%),var(--navy);padding:48px 0 64px}
.dashboard-intro{margin-bottom:24px}
.dashboard-intro h1{font-size:54px;line-height:1;margin:0 0 14px;letter-spacing:-.04em}
.dashboard-intro p:last-child{font-size:16px;line-height:1.55;color:#cbdbea;margin:0;max-width:780px}
.dashboard-metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:18px}
.dashboard-metric{min-height:170px;padding:22px 16px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}
.dashboard-metric svg{width:42px;height:42px;color:#20a1ff;margin-bottom:12px}
.dashboard-metric .sap-mark{width:62px;height:40px;margin-bottom:14px;display:grid;place-items:center;font-size:22px;font-weight:900;background:linear-gradient(140deg,#52aaff,#0066d8);clip-path:polygon(0 0,100% 0,72% 100%,0 100%)}
.dashboard-metric strong{font-size:38px;line-height:1;margin-bottom:10px}
.dashboard-metric span{font-size:13px;color:#d4dfeb}
.dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
.dashboard-panel{padding:22px}
.dashboard-panel .panel-label{color:#20a1ff;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin:0 0 7px}
.dashboard-panel h2{font-size:25px;margin:0 0 4px}
.dashboard-panel .panel-sub{font-size:11px;color:#a9bfd4;margin:0 0 18px}
.chart-list{display:grid;gap:7px}
.chart-row{display:grid;grid-template-columns:185px 1fr 24px;gap:10px;align-items:center}
.chart-row .label{font-size:12px;color:#dce8f4;white-space:nowrap}
.bar-track{height:11px;background:#0c3c70;border-radius:999px;overflow:hidden}
.bar-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#2e91ff,#5eb7ff)}
.chart-row .value{font-size:11px;color:#fff;text-align:right}
.dashboard-map{height:485px;position:relative;background:#031a3b url("world-map-dark.png") center/96% auto no-repeat;border-radius:10px;border:1px solid rgba(49,145,238,.22);overflow:hidden}
.dashboard-map:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,transparent 45%,rgba(1,14,34,.25));pointer-events:none}
.dash-marker{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#fff;white-space:nowrap;z-index:2;text-shadow:0 2px 5px #000}
.dash-marker:before{content:"";width:12px;height:12px;border-radius:50%;background:#ffbf16;border:2px solid #fff;box-shadow:0 0 0 5px rgba(255,178,0,.17)}
.dash-marker.brazil{left:34%;top:67%}.dash-marker.argentina{left:33%;top:77%}.dash-marker.portugal{left:47%;top:39%}.dash-marker.norway{left:53%;top:20%}.dash-marker.finland{left:57%;top:25%}.dash-marker.uae{left:64%;top:52%}.dash-marker.indonesia{left:79%;top:65%}.dash-marker.australia{left:84%;top:78%}
.capability-wrap{margin-top:18px}
.architecture-tree{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.arch-root{grid-column:1/-1;width:52%;margin:auto;text-align:center;padding:11px 14px;border-radius:8px;background:linear-gradient(90deg,#0b3f88,#1259ac);font-size:14px;font-weight:800}
.arch-group{border:1px solid rgba(77,155,231,.48);border-radius:10px;padding:15px;background:#041f42;min-height:136px}
.arch-group h3{text-align:center;font-size:13px;margin:0 0 13px;color:#e4effa}
.arch-tags{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.arch-tag{padding:8px 10px;border-radius:6px;background:#0a386d;color:#dcecff;font-size:10px;border:1px solid rgba(44,132,221,.18)}
.role-list{display:grid;gap:9px;margin-top:18px}
.role-row{display:grid;grid-template-columns:minmax(180px,1fr) 70px minmax(135px,.78fr);gap:12px;align-items:center}
.role-name,.role-outcome{min-height:36px;border-radius:7px;display:flex;align-items:center;padding:0 12px;font-size:12px}
.role-name{background:#082e5b;color:#e5f0fb}.role-name:before{content:"●";font-size:10px;color:#65b6ff;margin-right:9px}
.role-outcome{color:#fff;font-weight:650}.role-outcome:before{content:"✦";color:#ffbf16;margin-right:8px}
.role-arrow{height:2px;background:linear-gradient(90deg,#2f8fff,#5eb8ff);position:relative}
.role-arrow:after{content:"";position:absolute;right:-1px;top:-4px;border-left:8px solid #5eb8ff;border-top:5px solid transparent;border-bottom:5px solid transparent}
.role-note{font-size:12px;line-height:1.55;color:#c0d0df;margin:20px 0 0}
.insights-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:18px}
.insight-card{min-height:172px;padding:24px;display:grid;grid-template-columns:54px 1fr;gap:16px;align-items:start}
.insight-card svg{width:50px;height:50px;color:#20a1ff}
.insight-card h3{font-size:18px;margin:0 0 8px}
.insight-card p{font-size:13px;line-height:1.55;color:#c6d5e4;margin:0}
.dashboard-cta{padding:23px 28px;display:flex;justify-content:space-between;align-items:center;gap:24px}
.dashboard-cta-copy{display:grid;grid-template-columns:44px 1fr;gap:16px;align-items:center}
.dashboard-cta-copy svg{width:38px;height:38px;color:#20a1ff}
.dashboard-cta h2{font-size:21px;margin:0 0 5px}.dashboard-cta p{font-size:12px;color:#b9cce0;margin:0}
@media(max-width:1050px){.dashboard-metrics{grid-template-columns:repeat(3,1fr)}.dashboard-grid{grid-template-columns:1fr}.dashboard-map{height:430px}.insights-grid{grid-template-columns:1fr 1fr}.insight-card:last-child{grid-column:1/-1}}
@media(max-width:760px){.dashboard-metrics{grid-template-columns:repeat(2,1fr)}.chart-row{grid-template-columns:145px 1fr 22px}.architecture-tree{grid-template-columns:1fr}.arch-root{grid-column:1;width:100%}.role-row{grid-template-columns:1fr 52px 1fr}.insights-grid{grid-template-columns:1fr}.insight-card:last-child{grid-column:auto}.dashboard-cta{flex-direction:column;align-items:flex-start}}
@media(max-width:520px){.dashboard-intro h1{font-size:42px}.dashboard-metrics{grid-template-columns:1fr}.chart-row{grid-template-columns:120px 1fr 18px}.chart-row .label{font-size:10px}.dashboard-map{height:340px}.dash-marker{font-size:9px}.role-row{grid-template-columns:1fr}.role-arrow{width:40px;margin-left:20px;transform:rotate(90deg)}.dashboard-cta .button{width:100%}}

/* Quality review v5 — functional bars, map-anchored markers and aligned widgets */
.chart-list{gap:8px}
.chart-row{grid-template-columns:minmax(185px,42%) minmax(120px,1fr) 25px}
.chart-row .label{font-size:12.5px;overflow:hidden;text-overflow:ellipsis}
.bar-track{display:block;position:relative;height:12px;background:#041c3c;border:1px solid rgba(74,157,236,.22);box-shadow:inset 0 1px 3px rgba(0,0,0,.28)}
.bar-fill{display:block;height:100%;min-width:5px;background:linear-gradient(90deg,#25a6ff,#63c5ff);box-shadow:0 0 12px rgba(38,169,255,.34)}
.dashboard-map{height:auto;aspect-ratio:1706/864;position:relative;background:#02152f;border-radius:10px;border:1px solid rgba(49,145,238,.28);overflow:hidden;margin-top:16px}
.dashboard-map>img{display:block;width:100%;height:100%;object-fit:contain}
.dashboard-map:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,transparent 48%,rgba(1,14,34,.20));pointer-events:none}
.dash-marker{position:absolute;transform:translateY(-50%);display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700;color:#fff;white-space:nowrap;z-index:2;text-shadow:0 2px 5px #000}
.dash-marker.label-left{transform:translate(-100%,-50%);flex-direction:row-reverse}
.dash-marker i{display:block;flex:0 0 auto;width:11px;height:11px;border-radius:50%;background:#ffbf16;border:2px solid #fff;box-shadow:0 0 0 5px rgba(255,178,0,.17)}
.dash-marker b{font-size:inherit;font-weight:750}
.dash-marker.brazil{left:32.6%;top:57.8%}.dash-marker.argentina{left:32.4%;top:72.4%}.dash-marker.portugal{left:49.0%;top:26.5%}.dash-marker.norway{left:54.8%;top:11.4%}.dash-marker.finland{left:58.2%;top:11.6%}.dash-marker.uae{left:65.8%;top:32.7%}.dash-marker.indonesia{left:81.5%;top:52.9%}.dash-marker.australia{left:85.0%;top:68.4%}
.competency-role-grid{align-items:stretch}
.competency-role-grid>.dashboard-panel{height:100%}
.capability-wrap{margin-top:0}
@media(max-width:760px){.chart-row{grid-template-columns:minmax(130px,42%) minmax(80px,1fr) 22px}.dashboard-map{aspect-ratio:1706/864}.dash-marker{font-size:9px;gap:4px}.dash-marker i{width:9px;height:9px;border-width:1px}.dash-marker.uae b{max-width:90px;white-space:normal;line-height:1.1}}
@media(max-width:520px){.chart-row{grid-template-columns:minmax(112px,44%) minmax(64px,1fr) 18px}.chart-row .label{font-size:10px}.dashboard-map{height:auto}.dash-marker{font-size:7.5px}.dash-marker i{width:7px;height:7px}.dash-marker.uae b{max-width:64px}}
.dash-marker:before{content:none}


/* Final refinements v7 — official SAP logo, vertically centered map without Antarctica, and competency corrections */
.dashboard-metric .sap-logo-official{
  display:block;
  width:70px;
  height:auto;
  max-height:44px;
  object-fit:contain;
  margin:0 0 12px;
}
.map-panel{display:flex;flex-direction:column}
.map-panel .dashboard-map{
  flex:1 1 auto;
  min-height:410px;
  width:100%;
  margin-top:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#02152f;
  aspect-ratio:auto;
}
.map-canvas{
  position:relative;
  width:100%;
  aspect-ratio:2397/1025;
}
.map-canvas>img{display:block;width:100%;height:100%;object-fit:contain}
.dashboard-map:after{content:none}
.dash-marker.brazil{left:32.6%;top:68.5%}
.dash-marker.argentina{left:32.4%;top:85.9%}
.dash-marker.portugal{left:49.0%;top:31.4%}
.dash-marker.norway{left:54.8%;top:13.5%}
.dash-marker.finland{left:58.2%;top:13.8%}
.dash-marker.uae{left:65.8%;top:38.8%}
.dash-marker.indonesia{left:81.5%;top:62.7%}
.dash-marker.australia{left:85.0%;top:81.1%}
.dashboard-panel h2+ .chart-list{margin-top:18px}
@media(max-width:1050px){.map-panel .dashboard-map{min-height:360px}}
@media(max-width:760px){.map-panel .dashboard-map{min-height:300px}.map-canvas{width:100%}}
@media(max-width:520px){.map-panel .dashboard-map{min-height:235px}}

/* Final V7 approval — dashboard readability and visual consistency */
.dashboard-metric span{
  font-size:15px;
  line-height:1.28;
}
.chart-row .label{
  font-size:14px;
  line-height:1.2;
}
.chart-row .value{
  font-size:13px;
  font-weight:700;
}
.map-panel,
.map-panel .dashboard-map,
.map-panel .map-canvas{
  background:#02152f;
}
@media(max-width:760px){
  .dashboard-metric span{font-size:14px}
  .chart-row .label{font-size:12px}
  .chart-row .value{font-size:12px}
}
@media(max-width:520px){
  .dashboard-metric span{font-size:14px}
  .chart-row .label{font-size:11px}
  .chart-row .value{font-size:11px}
}

/* V8 final dashboard consolidation */
.map-panel{
  background:#02152f;
}
.map-panel .dashboard-map{
  background:#02152f;
  border:0;
  box-shadow:none;
}
.dashboard-metric .sap-logo-official{
  width:76px;
  max-height:46px;
  object-fit:contain;
  image-rendering:auto;
}
