body {
            font-family: 'Hanken Grotesk', sans-serif; -webkit-font-smoothing: antialiased; font-size: 15px; line-height: 22px;
            background: linear-gradient(135deg, #ffffff 0%, #ece9f7 45%, #d4d9e8 100%);
            background-attachment: fixed;
        }
        /* Visuales: bordes suaves, sombra suave y elevación en hover */
        .viz { border-color: #e8eaed !important; border-radius: 10px !important; overflow: hidden; background: rgba(255,255,255,.72) !important; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: 0 1px 2px rgba(16,24,40,.05), 0 12px 26px -10px rgba(16,24,40,.22) !important; transition: box-shadow .25s ease, transform .25s ease; }
        .viz:hover { box-shadow: 0 24px 46px -14px rgba(16,24,40,.34), 0 8px 16px -8px rgba(16,24,40,.16) !important; transform: translateY(-3px); }
        .vermas { transition: background-color .2s ease, color .2s ease; cursor: pointer; }
        .material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
        /* ===== Header con presencia ===== */
        .hero-head{ position:relative; overflow:hidden; color:#fff; border-radius:10px;
          background:linear-gradient(120deg,#001740 0%,#002b69 55%,#0a3a86 100%);
          box-shadow:0 14px 34px -14px rgba(0,23,64,.55); }
        .hero-head::before{ content:''; position:absolute; inset:0; pointer-events:none;
          background-image:radial-gradient(circle at 1px 1px, rgba(255,255,255,.10) 1px, transparent 0);
          background-size:22px 22px; opacity:.5; }
        /* ===== Badges tipo pill ===== */
        .pill{ display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:800; text-transform:uppercase;
          letter-spacing:.04em; padding:4px 10px; border-radius:999px; }
        .pill .material-symbols-outlined{ font-size:14px; font-variation-settings:'FILL' 0,'wght' 600; }
        .pill-amber{ background:#fef3c7; color:#b45309; }
        .pill-red{ background:#fee2e2; color:#b91c1c; }
        /* Slider de meses del modal del gráfico — línea fina + muesca horizontal */
        #monthSlider { -webkit-appearance:none; appearance:none; width:100%; height:3px; border-radius:2px; background:#e6e8ee; outline:none; cursor:pointer; transition:background .15s ease; }
        #monthSlider::-webkit-slider-thumb { -webkit-appearance:none; appearance:none; width:24px; height:11px; border-radius:6px; background:#001740; border:none; box-shadow:0 1px 4px rgba(0,23,64,.35); cursor:grab; transition:transform .12s ease, background .12s ease; }
        #monthSlider::-webkit-slider-thumb:hover { transform:scaleX(1.15); }
        #monthSlider:active::-webkit-slider-thumb { cursor:grabbing; background:#bb0027; transform:scaleX(1.2); }
        #monthSlider::-moz-range-thumb { width:24px; height:11px; border-radius:6px; background:#001740; border:none; box-shadow:0 1px 4px rgba(0,23,64,.35); cursor:grab; }
        #monthSlider:active::-moz-range-thumb { background:#bb0027; }
        #monthSlider::-moz-range-track { height:3px; border-radius:2px; background:transparent; }
        /* Conmutador Financiero / Físico (estilo pestañas) */
        .chart-seg { display:flex; gap:2px; background:rgba(255,255,255,.14); border-radius:999px; padding:4px; }
        .chart-mode-btn { display:flex; align-items:center; gap:6px; color:rgba(255,255,255,.85); background:transparent; border:none; border-radius:999px; padding:7px 16px; cursor:pointer; transition:background .25s ease, color .25s ease, transform .15s ease, box-shadow .25s ease; }
        .chart-mode-btn .material-symbols-outlined { transition:transform .25s ease; }
        .chart-mode-btn:hover { color:#fff; background:rgba(255,255,255,.12); }
        .chart-mode-btn:active { transform:scale(.96); }
        .chart-mode-btn.active { background:#fff; color:#001740; box-shadow:0 3px 10px rgba(0,0,0,.22); }
        .chart-mode-btn.active .material-symbols-outlined { transform:scale(1.12); }
        /* Animación de apertura del modal del gráfico */
        @keyframes modalFadeIn { from{ opacity:0; backdrop-filter:blur(0); } to{ opacity:1; } }
        @keyframes modalPanelIn {
          from { opacity:0; transform:scale(.95); }
          to   { opacity:1; transform:scale(1); }
        }
        #modalChart.flex .modal-fade, #modalGantt.flex .modal-fade, #modalEtapas.flex .modal-fade { animation:modalFadeIn .35s ease both; }
        #modalChart.flex .modal-panel, #modalGantt.flex .modal-panel, #modalEtapas.flex .modal-panel { animation:modalPanelIn .38s cubic-bezier(.22,1,.36,1) both; transform-origin:center center; }

        /* ===== KPI Ejecución Presupuestal (diseño dashboard-ejecucion) ===== */
        .ek{--teal:#0E7C7B;--teal-deep:#0A5C5B;--amber:#D9962E;--clay:#BE4234;--track:#DEE6E6;--ek-ink:#13242B;--ek-soft:#42565E;--ek-line:#e8eaed;}
        .ek-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.85rem;}
        @media(max-width:1500px){.ek-grid{grid-template-columns:1fr 1fr;}}
        @media(max-width:760px){.ek-grid{grid-template-columns:1fr;}}
        .ek-card{background:rgba(255,255,255,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--ek-line);border-radius:10px;padding:10px 16px;box-shadow:0 1px 2px rgba(16,24,40,.05),0 12px 26px -10px rgba(16,24,40,.22);display:flex;flex-direction:column;justify-content:flex-start;transition:box-shadow .25s ease, transform .25s ease;}
        .ek-card:hover{box-shadow:0 24px 46px -14px rgba(16,24,40,.34),0 8px 16px -8px rgba(16,24,40,.16);transform:translateY(-3px);}
        .ek-num{font-family:'Hanken Grotesk',sans-serif;font-variant-numeric:tabular-nums lining-nums;letter-spacing:-.02em;}
        .ek-hero{display:grid;grid-template-columns:1fr;gap:11px;align-items:start;}
        .ek-big{font-size:clamp(46px,4vw,64px);font-weight:600;line-height:.95;color:var(--ek-ink);margin-top:2px;}
        .ek-unit{font-size:.32em;font-weight:500;color:var(--ek-soft);letter-spacing:0;margin-left:6px;}
        .ek-title{font-size:16.5px;font-weight:600;color:var(--ek-ink);}
        .ek-desc{font-size:13px;color:var(--ek-soft);margin-top:2px;}
        .ek-bars{display:flex;flex-direction:column;gap:8px;margin-top:6px;}
        .ek-mtop{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px;gap:10px;}
        .ek-mname{font-size:15px;font-weight:600;color:var(--ek-ink);}
        .ek-mname small{display:block;font-weight:400;font-size:12.5px;color:var(--ek-soft);margin-top:2px;}
        .ek-pct{font-family:'Hanken Grotesk',sans-serif;font-size:25px;font-weight:600;flex:none;}
        .ek-mbar{position:relative;height:10px;border-radius:0;background:var(--track);overflow:visible;display:flex;}
        .ek-mbar i{display:block;height:100%;width:0;border-radius:0;transition:width 1.1s cubic-bezier(.2,.7,.2,1);}
        .ek-mark{position:absolute;top:-5px;bottom:-5px;width:3px;background:#13242B;z-index:3;box-shadow:0 0 0 1px rgba(255,255,255,.85);}
        .ek-mark::before{content:'';position:absolute;top:-6px;left:50%;transform:translateX(-50%);border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #13242B;}
        .ek-mmeta{display:flex;gap:16px;margin-top:8px;font-size:12.5px;color:var(--ek-soft);flex-wrap:wrap;}
        .ek-mmeta b{color:var(--ek-ink);font-family:'Hanken Grotesk',sans-serif;font-weight:600;}
        @media(prefers-reduced-motion:reduce){.ek-mbar i {transition:none!important;}}