:root{--mpdu:#A70000;--ink:#141414;--muted:#60646c;--line:#e8e5e3;--soft:#f6f5f4;--bg:#ffffff;--card:#ffffff}
.mpdu-wrap{background:var(--bg);color:var(--ink);}
.mpdu-container{max-width:1280px;margin:0 auto;padding:1.25rem}
.kicker{text-transform:uppercase;letter-spacing:.12em;color:var(--mpdu);font-weight:800;font-size:.8rem}
/* Header */
.mpdu-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin:.5rem 0 1rem}
.mpdu-header .brand{display:flex;align-items:center;gap:.8rem}
.mpdu-header img{height:46px;width:auto}
.mpdu-header .avatar{height:46px;width:46px;border-radius:12px;background:var(--soft);display:grid;place-items:center;font-weight:900}
.tabs{display:flex;gap:.4rem;align-items:center}
.tab{border:1px solid var(--line);background:#fff;border-radius:12px;padding:.5rem .9rem;font-weight:800;cursor:pointer;transition:.2s}
.tab.active{border-color:var(--mpdu);box-shadow:0 0 0 2px color-mix(in srgb, var(--mpdu) 22%, transparent)}
.tab.ghost{background:transparent;border-color:transparent}
/* Gauges */
.gauges{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin:.8rem 0}
.gauge{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:.9rem;box-shadow:0 10px 24px rgba(0,0,0,.06);display:grid;gap:.5rem;place-items:center}
.gauge .label{color:var(--muted);font-weight:700}
.gauge .dial{width:160px;height:80px;border-radius:160px 160px 0 0 / 160px 160px 0 0;position:relative;background:
 radial-gradient(closest-side,#fff 79%,transparent 80% 100%),
 conic-gradient(from -90deg,
   #e25151 0deg, #e25151 calc(var(--val,0)*1.8deg),
   #efefef calc(var(--val,0)*1.8deg) 180deg);
 border:1px solid var(--line);overflow:hidden}
.gauge .dial .needle{position:absolute;left:50%;bottom:-2px;transform-origin:50% 100%;width:2px;height:78px;background:var(--ink);transform:rotate(calc(-90deg + var(--val,0)*1.8deg));transition:transform .8s cubic-bezier(.2,.6,.2,1)}
.gauge .value{font-size:1.3rem;font-weight:900}
/* KPI */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin:.8rem 0}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:.9rem;box-shadow:0 10px 24px rgba(0,0,0,.06);display:grid;gap:.3rem}
.kpi .t{color:var(--muted);font-size:.9rem}
.kpi .v{font-weight:900;font-size:1.35rem}
/* Grid & Cards */
.grid{display:grid;grid-template-columns:2fr 1fr;gap:.8rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:1rem;box-shadow:0 10px 24px rgba(0,0,0,.06)}
.card h3{margin:.2rem 0 1rem}
/* Charts */
svg.line{width:100%;height:120px}
svg.line polyline{fill:none;stroke:var(--mpdu);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.labels{display:grid;grid-template-columns:repeat(8,1fr);gap:.2rem;margin-top:.4rem;color:var(--muted);font-size:.8rem}
/* Donut */
.donut{width:170px;height:170px;border-radius:50%;margin:0 auto;position:relative;box-shadow:inset 0 0 0 12px #fff}
.donut::after{content:"";position:absolute;inset:20px;border-radius:50%;background:#fff;border:1px solid var(--line)}
.donut .donut-inner{position:absolute;inset:0;display:grid;place-items:center}
.donut .donut-inner strong{font-size:1.4rem}
.legend{display:grid;gap:.3rem;margin-top:.6rem}
.legend li{display:flex;align-items:center;gap:.4rem;color:var(--muted)}
.legend i{display:inline-block;width:14px;height:14px;border-radius:4px}
/* Table */
.table{display:grid;gap:.2rem}
.tr{display:grid;grid-template-columns:80px 1fr 150px 130px 140px 80px;gap:.4rem;align-items:center;padding:.4rem .5rem;border:1px solid var(--line);border-radius:12px}
.tr.head{background:#fafafa;font-weight:700}
.tr .title{font-weight:600}
.badge{display:inline-block;padding:.18rem .45rem;border-radius:999px;font-size:.8rem;font-weight:800;color:#fff}
.badge.red{background:var(--mpdu)}
.badge.orange{background:#ff7f50}
.badge.blue{background:#4c8df1}
.badge.green{background:#0aa15e}
.late{color:#A70000;font-weight:700}
/* Objetivos */
.progress{height:14px;background:#f1f1f1;border-radius:999px;overflow:hidden;border:1px solid var(--line);margin:.5rem 0 1rem}
.progress .bar{height:100%;width:var(--pct,0%);background:linear-gradient(90deg, var(--mpdu), #ff7f50);transition:width .8s}
/* Alertas */
.alerts{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin:.8rem 0}
.alert{border:1px solid var(--line);border-radius:16px;padding:1rem;background:var(--card);box-shadow:0 10px 24px rgba(0,0,0,.06)}
.alert .title{font-weight:900}
.alert .num{font-size:1.8rem;font-weight:900;margin:.2rem 0}
.alert.ok{border-color:#d8e8d8}
.alert.warn{border-color:#ffe19a; background: #fff9e7}
.alert.danger{border-color:#ffb3b3; background:#fff1f1}
.alert .desc{color:var(--muted)}
/* Tabs */
.tab-panel{display:none}
.tab-panel.active{display:block}
/* Buttons */
.btn{display:inline-block;padding:.55rem .85rem;border-radius:12px;border:2px solid var(--mpdu);background:var(--mpdu);color:#fff;text-decoration:none;font-weight:800}
.btn.ghost{background:transparent;color:var(--mpdu)}
.btn.small{padding:.35rem .6rem;font-size:.85rem}
.actions{display:flex;gap:.5rem;flex-wrap:wrap}
/* Locked */
.mpdu-locked{display:grid;place-items:center;padding:3rem 0}
.card{max-width:100%;}
/* Dark mode */
.dark .mpdu-wrap{--bg:#0f1114;--card:#15181c;--ink:#e8e8e8;--muted:#a3a6ad;--line:#2a2e35}
.dark .tab{background:var(--card);border-color:var(--line);color:var(--ink)}
.dark .tr.head{background:#1a1f25}
@media(max-width:1200px){.gauges{grid-template-columns:1fr 1fr} .kpis{grid-template-columns:1fr 1fr} .grid{grid-template-columns:1fr} .alerts{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.labels{grid-template-columns:repeat(4,1fr)} .alerts{grid-template-columns:1fr} .tr{grid-template-columns:1fr} .tr.head{display:none}}