:root{
  --bg:#f6f4ef;
  --surface:#ffffff;
  --line:#e3ddd0;
  --text:#0f2a3d;
  --muted:#667684;
  --navy:#08253a;
  --navy2:#0d314b;
  --gold:#c89d43;
  --gold2:#e0bb6b;
  --soft:#f3efe6;
  --blueA:#dfe8f4;
  --blueB:#b8d0ee;
  --blueC:#7ca7df;
  --blueD:#3f78bf;
  --blueE:#184f93;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,Montserrat,"Segoe UI",Arial,sans-serif}
body{min-width:1440px}
.app-shell{padding:18px 24px 28px}
.topbar{
  display:grid;grid-template-columns:320px 1fr 60px;align-items:center;
  gap:20px;padding:12px 8px 20px;border-bottom:1px solid var(--line)
}
.brand{font-size:20px;font-weight:900;letter-spacing:.08em}
.brand span{color:var(--gold)}
.status-line{margin-top:8px;display:flex;gap:10px;align-items:center;color:var(--muted);font-size:13px}
.online-dot{width:10px;height:10px;border-radius:999px;background:#3eb489;display:inline-block}
.menu{display:flex;justify-content:center;gap:36px}
.menu a{text-decoration:none;color:var(--text);font-size:14px;font-weight:700;padding-bottom:8px}
.menu a.active{border-bottom:2px solid var(--gold);color:var(--navy)}
.profile{
  width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
  background:var(--navy);color:#fff;font-weight:800
}
.context-strip{
  margin-top:14px;display:grid;grid-template-columns:repeat(4,1fr) 220px;gap:12px
}
.context-card,.export-btn{
  background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px
}
.context-card strong{display:block;font-size:13px}
.context-card span{display:block;margin-top:4px;color:var(--muted);font-size:12px}
.export-btn{
  cursor:pointer;font-weight:800;color:var(--navy);background:#fbfaf6
}
.hero-row{
  margin-top:18px;display:grid;grid-template-columns:1.2fr 1.25fr;gap:18px;align-items:stretch
}
.hero-copy,.hero-kpis{
  background:transparent
}
.hero-copy h1{
  margin:0;font-size:38px;line-height:1.08;letter-spacing:-.04em
}
.hero-copy p{margin:14px 0 0;color:var(--muted);font-size:17px;max-width:90%}
.hero-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.kpi-card{
  background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px 18px
}
.kpi-card span{display:block;font-size:12px;text-transform:uppercase;color:var(--muted);font-weight:700}
.kpi-card strong{display:block;margin-top:10px;font-size:28px;color:var(--navy)}
.kpi-card small{display:block;margin-top:6px;color:var(--muted)}
.dashboard-main{
  margin-top:18px;display:grid;grid-template-columns:290px 1fr 420px;gap:18px;align-items:start
}
.filters-panel,.map-panel,.summary-panel,.insight-card,.cta-strip{
  background:var(--surface);border:1px solid var(--line);border-radius:18px
}
.panel-head{display:flex;justify-content:space-between;align-items:flex-start;padding:16px 18px 8px}
.panel-head h3{margin:0;font-size:16px}
.panel-head p{margin:5px 0 0;color:var(--muted);font-size:12px}
.panel-head.dark{
  background:linear-gradient(145deg,var(--navy),var(--navy2));
  color:#fff;border-radius:18px 18px 0 0
}
.panel-head.dark p{color:rgba(255,255,255,.72)}
.filters-panel .field{padding:0 18px 14px}
.filters-panel label{display:block;margin-bottom:7px;font-size:12px;font-weight:800;color:var(--muted)}
.filters-panel select{
  width:100%;height:42px;border:1px solid var(--line);border-radius:10px;
  padding:0 12px;background:#fbfaf7;color:var(--text)
}
.analyze-btn{
  margin:8px 18px 18px;width:calc(100% - 36px);height:56px;border:0;border-radius:12px;
  background:linear-gradient(135deg,var(--gold),#b78528);color:#fff;font-weight:900;letter-spacing:.08em;cursor:pointer
}
.map-tabs{display:flex;gap:10px}
.map-tabs button{
  height:34px;padding:0 16px;border-radius:10px;border:1px solid var(--line);background:#fff;cursor:pointer
}
.map-tabs .active{border-color:var(--gold);color:var(--navy);font-weight:800}
.map-stage{padding:8px 18px 18px}
.map-placeholder{
  min-height:370px;border:1px solid var(--line);border-radius:16px;background:#fcfbf8;
  display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative
}
.map-title{font-size:36px;font-weight:900;color:var(--navy)}
.map-subtitle{margin-top:10px;color:var(--muted)}
.map-grid{
  margin-top:28px;display:grid;grid-template-columns:repeat(3,130px);gap:12px
}
.map-box{
  height:64px;border-radius:12px;background:var(--blueB);display:grid;place-items:center;font-weight:800;color:var(--navy)
}
.map-box.strong{background:var(--blueE);color:#fff}
.map-box.light{background:var(--blueA)}
.legend{
  margin-top:14px;display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:12px
}
.legend span{display:flex;align-items:center;gap:8px}
.legend i{display:inline-block;width:12px;height:12px;border-radius:3px}
.legend .c1{background:var(--blueE)}
.legend .c2{background:var(--blueD)}
.legend .c3{background:var(--blueC)}
.legend .c4{background:var(--blueB)}
.legend .c5{background:var(--blueA)}
.summary-panel{
  background:linear-gradient(145deg,var(--navy),#0d3550);color:#fff;padding:18px
}
.summary-head{font-size:16px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}
.summary-highlight{
  margin-top:14px;padding:18px;border:1px solid rgba(255,255,255,.14);border-radius:16px;background:rgba(255,255,255,.04)
}
.summary-highlight span{display:block;color:rgba(255,255,255,.72);font-size:12px;text-transform:uppercase}
.summary-highlight strong{display:block;margin-top:10px;font-size:44px;color:var(--gold2)}
.summary-highlight small{display:block;margin-top:8px;color:rgba(255,255,255,.76)}
.summary-grid{
  margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:12px
}
.summary-card{
  border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:16px;background:rgba(255,255,255,.04)
}
.summary-card span{display:block;font-size:11px;color:rgba(255,255,255,.72);text-transform:uppercase}
.summary-card strong{display:block;margin-top:10px;font-size:28px;color:#fff}
.summary-card small{display:block;margin-top:6px;color:rgba(255,255,255,.62)}
.details-btn{
  margin-top:14px;width:100%;height:46px;border-radius:10px;border:1px solid rgba(224,187,107,.5);
  background:transparent;color:#fff;font-weight:800;cursor:pointer
}
.insights-row{
  margin-top:18px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px
}
.insight-card{padding:18px}
.insight-card h4{margin:0 0 12px;font-size:15px}
.bars .bar{display:grid;grid-template-columns:110px 1fr;gap:12px;align-items:center;margin:12px 0}
.bars .bar span{font-size:13px;color:var(--muted)}
.bars .bar b{display:block;height:8px;border-radius:999px;background:var(--navy)}
.simple-list{margin:0;padding-left:18px;color:var(--text)}
.simple-list li{margin:9px 0}
.empty-note{color:var(--muted);font-size:13px;line-height:1.6}
.cta-strip{
  margin-top:18px;padding:18px 22px;
  display:grid;grid-template-columns:1.2fr 320px 1fr;gap:24px;align-items:center;
  background:linear-gradient(145deg,var(--navy),#0d3550);color:#fff
}
.cta-left strong,.cta-right strong{display:block;font-size:18px}
.cta-left span{display:block;margin-top:8px;color:rgba(255,255,255,.75);line-height:1.5}
.unlock-btn{
  display:grid;place-items:center;height:64px;border-radius:14px;background:linear-gradient(135deg,var(--gold),#b78528);
  text-decoration:none;color:#fff;font-weight:900;letter-spacing:.08em
}
.cta-right ul{margin:8px 0 0;padding-left:18px;color:rgba(255,255,255,.82)}
.cta-right li{margin:6px 0}

/* =========================================================
   RM | DATA HUB
   EXECUTIVE SINGLE SCREEN V2
   Header KPI + alta densidade
   ========================================================= */

body{
    min-width:1180px;
}

.app-shell{
    padding:10px 16px 18px;
}

/* =========================================================
   HEADER
   ========================================================= */

.topbar{
    display:grid;
    grid-template-columns:265px minmax(0,1fr);
    align-items:center;
    gap:18px;

    padding:7px 4px 10px;

    border-bottom:1px solid var(--line);
}

.brand{
    font-size:17px;
    line-height:1;
}

.status-line{
    margin-top:5px;
    gap:7px;

    font-size:9px;
}

.online-dot{
    width:7px;
    height:7px;
}

.top-kpi-strip{
    display:grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    gap:8px;
}

.top-kpi-card{
    min-width:0;

    padding:9px 13px;

    border:1px solid var(--line);
    border-radius:9px;

    background:
        rgba(255,255,255,.74);
}

.top-kpi-card span{
    display:block;

    color:var(--muted);

    font-size:8px;
    font-weight:800;

    letter-spacing:.055em;
    text-transform:uppercase;
}

.top-kpi-card strong{
    display:block;

    margin-top:4px;

    color:var(--navy);

    font-size:19px;
    line-height:1;
}

.top-kpi-card small{
    display:block;

    margin-top:4px;

    color:var(--muted);

    font-size:8px;
}

/* componentes antigos removidos */
.menu,
.profile,
.context-strip,
.hero-kpis{
    display:none !important;
}

/* =========================================================
   HERO COMPACTO
   ========================================================= */

.hero-row{
    display:block;

    margin-top:11px;
}

.hero-copy{
    display:flex;

    justify-content:space-between;
    align-items:flex-end;

    gap:30px;
}

.hero-copy h1{
    width:62%;

    margin:0;

    font-size:26px;
    line-height:1.03;

    letter-spacing:-.035em;
}

.hero-copy p{
    width:36%;

    margin:0;

    color:var(--muted);

    font-size:10px;
    line-height:1.45;

    text-align:right;
}

/* =========================================================
   DASHBOARD PRINCIPAL
   ========================================================= */

.dashboard-main{
    margin-top:11px;

    grid-template-columns:
        228px
        minmax(0,1fr)
        325px;

    gap:11px;
}

/* caixas */
.filters-panel,
.map-panel,
.summary-panel,
.insight-card,
.cta-strip{
    border-radius:11px;
}

/* =========================================================
   FILTROS
   ========================================================= */

.panel-head{
    padding:10px 12px 6px;
}

.panel-head.dark{
    border-radius:11px 11px 0 0;
}

.panel-head h3{
    font-size:11px;
}

.panel-head p{
    margin-top:3px;

    font-size:8px;
}

.filters-panel .field{
    padding:0 12px 7px;
}

.filters-panel label{
    margin-bottom:3px;

    font-size:8px;
}

.filters-panel select{
    height:31px;

    padding:0 8px;

    border-radius:6px;

    font-size:9px;
}

.analyze-btn{
    width:calc(100% - 24px);

    height:42px;

    margin:3px 12px 12px;

    border-radius:7px;

    font-size:9px;
}

/* =========================================================
   MAPA
   ========================================================= */

.map-tabs{
    gap:5px;
}

.map-tabs button{
    height:27px;

    padding:0 11px;

    border-radius:6px;

    font-size:8px;
}

.map-stage{
    padding:4px 12px 10px;
}

.map-placeholder{
    min-height:275px;

    border-radius:10px;
}

.map-title{
    font-size:25px;
}

.map-subtitle{
    margin-top:5px;

    font-size:9px;
}

.map-grid{
    margin-top:16px;

    grid-template-columns:
        repeat(3,98px);

    gap:7px;
}

.map-box{
    height:44px;

    border-radius:7px;

    font-size:9px;
}

.legend{
    margin-top:7px;

    gap:10px;

    font-size:8px;
}

.legend i{
    width:8px;
    height:8px;
}

/* =========================================================
   RESUMO DO MERCADO
   ========================================================= */

.summary-panel{
    padding:12px;
}

.summary-head{
    font-size:10px;
}

.summary-highlight{
    margin-top:8px;

    padding:12px;

    border-radius:9px;
}

.summary-highlight span{
    font-size:8px;
}

.summary-highlight strong{
    margin-top:5px;

    font-size:30px;
}

.summary-highlight small{
    margin-top:3px;

    font-size:8px;
}

.summary-grid{
    margin-top:8px;

    gap:7px;
}

.summary-card{
    min-height:78px;

    padding:10px;

    border-radius:8px;
}

.summary-card span{
    font-size:7px;
}

.summary-card strong{
    margin-top:6px;

    font-size:17px;
    line-height:1.05;
}

.summary-card small{
    margin-top:3px;

    font-size:7px;
}

.details-btn{
    height:33px;

    margin-top:8px;

    border-radius:6px;

    font-size:8px;
}

/* =========================================================
   INSIGHTS
   ========================================================= */

.insights-row{
    margin-top:11px;

    gap:11px;
}

.insight-card{
    min-height:128px;

    padding:11px;
}

.insight-card h4{
    margin-bottom:7px;

    font-size:10px;
}

.bars .bar{
    grid-template-columns:
        70px
        1fr;

    gap:7px;

    margin:6px 0;
}

.bars .bar span{
    font-size:8px;
}

.bars .bar b{
    height:4px;
}

.simple-list{
    padding-left:14px;

    font-size:8px;
}

.simple-list li{
    margin:4px 0;
}

.empty-note{
    font-size:8px;
    line-height:1.45;
}

/* =========================================================
   CTA
   ========================================================= */

.cta-strip{
    margin-top:11px;

    padding:11px 15px;

    grid-template-columns:
        1.3fr
        240px
        1fr;

    gap:16px;
}

.cta-left strong,
.cta-right strong{
    font-size:11px;
}

.cta-left span{
    margin-top:3px;

    font-size:8px;
    line-height:1.4;
}

.unlock-btn{
    height:44px;

    border-radius:8px;

    font-size:9px;
}

.cta-right ul{
    margin-top:3px;

    padding-left:14px;

    font-size:8px;
}

.cta-right li{
    margin:2px 0;
}

/* =========================================================
   SEGURANÇA CONTRA OVERFLOW
   ========================================================= */

.topbar,
.top-kpi-strip,
.hero-row,
.dashboard-main,
.insights-row{
    min-width:0;
}

.topbar > *,
.top-kpi-strip > *,
.hero-row > *,
.dashboard-main > *,
.insights-row > *{
    min-width:0;
}

/* notebook / Windows scaling */
@media (max-width:1500px){

    body{
        min-width:1080px;
    }

    .app-shell{
        padding-left:10px;
        padding-right:10px;
    }

    .topbar{
        grid-template-columns:
            235px
            minmax(0,1fr);
    }

    .top-kpi-card{
        padding-left:9px;
        padding-right:9px;
    }

    .top-kpi-card strong{
        font-size:16px;
    }

    .hero-copy h1{
        font-size:23px;
    }

    .dashboard-main{
        grid-template-columns:
            210px
            minmax(0,1fr)
            300px;

        gap:9px;
    }
}


/* =========================================================
   RM | DATA HUB
   EXECUTIVE LEGIBILITY V1
   Compacto sem esforço visual
   ========================================================= */

/* Base geral */
body{
    font-size:12px;
}

/* ---------------------------------------------------------
   IDENTIDADE
   --------------------------------------------------------- */

.brand{
    font-size:18px !important;
}

.status-line{
    font-size:10.5px !important;
}

/* ---------------------------------------------------------
   CARDS SUPERIORES
   --------------------------------------------------------- */

.top-kpi-card{
    padding:10px 13px !important;
}

.top-kpi-card span{
    font-size:9.5px !important;
    line-height:1.2;
}

.top-kpi-card strong{
    margin-top:5px !important;

    font-size:21px !important;
    line-height:1.05;
}

.top-kpi-card small{
    margin-top:4px !important;

    font-size:9.5px !important;
    line-height:1.2;
}

/* ---------------------------------------------------------
   HERO
   --------------------------------------------------------- */

.hero-copy h1{
    font-size:28px !important;
    line-height:1.06 !important;
}

.hero-copy p{
    font-size:11.5px !important;
    line-height:1.5 !important;
}

/* ---------------------------------------------------------
   CABEÇALHOS DOS PAINÉIS
   --------------------------------------------------------- */

.panel-head h3{
    font-size:12.5px !important;
    line-height:1.2;
}

.panel-head p{
    font-size:9.5px !important;
    line-height:1.35;
}

/* ---------------------------------------------------------
   FILTROS
   --------------------------------------------------------- */

.filters-panel label{
    font-size:10px !important;
    line-height:1.25;
}

.filters-panel select{
    height:34px !important;

    font-size:11px !important;
    line-height:1.2;
}

.analyze-btn{
    height:44px !important;

    font-size:10.5px !important;
}

/* ---------------------------------------------------------
   MAPA
   --------------------------------------------------------- */

.map-tabs button{
    font-size:9.5px !important;
}

.map-title{
    font-size:27px !important;
}

.map-subtitle{
    font-size:10.5px !important;
    line-height:1.4;
}

.map-box{
    font-size:10px !important;
}

.legend{
    font-size:9.5px !important;
}

/* ---------------------------------------------------------
   RESUMO DO MERCADO
   --------------------------------------------------------- */

.summary-head{
    font-size:11px !important;
    line-height:1.3;
}

.summary-highlight span{
    font-size:9px !important;
}

.summary-highlight strong{
    font-size:32px !important;
    line-height:1.05;
}

.summary-highlight small{
    font-size:9.5px !important;
}

.summary-card span{
    font-size:8.5px !important;
    line-height:1.25;
}

.summary-card strong{
    font-size:17px !important;
    line-height:1.08;
}

.summary-card small{
    font-size:8.5px !important;
    line-height:1.25;
}

.details-btn{
    font-size:9.5px !important;
}

/* ---------------------------------------------------------
   INTELIGÊNCIA INFERIOR
   --------------------------------------------------------- */

.insight-card h4{
    font-size:11.5px !important;
    line-height:1.2;
}

.bars .bar span{
    font-size:9.5px !important;
}

.simple-list{
    font-size:9.5px !important;
    line-height:1.35;
}

.empty-note{
    font-size:9.5px !important;
    line-height:1.5 !important;
}

/* ---------------------------------------------------------
   CTA INFERIOR
   --------------------------------------------------------- */

.cta-left strong,
.cta-right strong{
    font-size:12px !important;
}

.cta-left span{
    font-size:9.5px !important;
    line-height:1.45 !important;
}

.unlock-btn{
    font-size:10.5px !important;
}

.cta-right ul{
    font-size:9.5px !important;
    line-height:1.35;
}

/* ---------------------------------------------------------
   PEQUENO AJUSTE DE RESPIRAÇÃO
   Mantemos a tela compacta, mas sem esmagar a leitura
   --------------------------------------------------------- */

.filters-panel .field{
    padding-bottom:8px !important;
}

.summary-card{
    padding:11px !important;
}

.insight-card{
    padding:13px !important;
}

/* ---------------------------------------------------------
   MONITORES <= 1500px
   Não reduzir novamente a tipografia.
   Apenas ajustar geometria.
   --------------------------------------------------------- */

@media (max-width:1500px){

    .top-kpi-card strong{
        font-size:19px !important;
    }

    .hero-copy h1{
        font-size:26px !important;
    }

    .filters-panel select{
        font-size:10.5px !important;
    }

    .summary-highlight strong{
        font-size:30px !important;
    }
}


/* =========================================================
   RM | DATA HUB
   CORPORATE FILTER CLEANUP
   ========================================================= */

.filters-panel .field{
    padding-bottom:10px !important;
}

.filters-panel label{
    font-size:10.5px !important;
    font-weight:700 !important;
}

.filters-panel select{
    height:35px !important;
    font-size:11px !important;
}

.filters-panel select:disabled{
    opacity:.58;
    cursor:not-allowed;
    background:#f2f1ed;
}

.analyze-btn{
    margin-top:7px !important;
    height:46px !important;
    font-size:10.5px !important;
}

/* Mais área útil para a visualização central */
.map-placeholder{
    min-height:300px !important;
}


/* =========================================================
   RM | DATA HUB
   HEADER CORPORATIVO OFICIAL — V12F
   ========================================================= */

/* ---------------------------------------------------------
   LINHA 1
   MARCA + POSICIONAMENTO
   --------------------------------------------------------- */

.topbar{
    display:grid !important;

    grid-template-columns:
        225px
        minmax(0,1fr) !important;

    gap:18px !important;

    align-items:center !important;

    min-height:78px;

    padding:
        8px
        4px
        10px !important;

    border-bottom:
        1px solid
        var(--line);
}

.brand-area{
    align-self:center;
}

.brand{
    font-size:18px !important;
}

.status-line{
    margin-top:5px !important;

    font-size:10px !important;
}

.header-message{
    min-width:0;

    display:flex;

    justify-content:center;
    align-items:center;

    padding:
        7px
        18px;
}

.header-message .hero-copy{
    display:block !important;

    width:100% !important;

    text-align:center !important;
}

.header-message .hero-copy h1{
    width:100% !important;

    max-width:none !important;

    margin:0 !important;

    font-size:27px !important;

    line-height:1.05 !important;

    letter-spacing:
        -.035em !important;

    text-align:center !important;
}

.header-message .hero-copy p{
    width:100% !important;

    max-width:none !important;

    margin:
        6px
        auto
        0 !important;

    font-size:10.5px !important;

    line-height:1.4 !important;

    text-align:center !important;

    color:var(--muted);
}

/* ---------------------------------------------------------
   LINHA 2
   QUATRO INDICADORES
   --------------------------------------------------------- */

.top-kpi-strip{
    display:grid !important;

    grid-template-columns:
        repeat(4,minmax(0,1fr)) !important;

    gap:9px !important;

    width:100%;

    margin-top:8px !important;

    margin-bottom:10px !important;
}

.top-kpi-card{
    min-height:68px;

    padding:
        10px
        14px !important;

    border-radius:9px !important;
}

.top-kpi-card span{
    font-size:9.5px !important;

    line-height:1.15;
}

.top-kpi-card strong{
    margin-top:4px !important;

    font-size:21px !important;

    line-height:1;
}

.top-kpi-card small{
    margin-top:4px !important;

    font-size:9.5px !important;
}

/* ---------------------------------------------------------
   HERO ORIGINAL NÃO OCUPA MAIS ESPAÇO
   --------------------------------------------------------- */

.hero-row{
    display:none !important;
}

/* ---------------------------------------------------------
   PAINEL PRINCIPAL SOBE IMEDIATAMENTE
   --------------------------------------------------------- */

.dashboard-main{
    margin-top:0 !important;
}

/* ---------------------------------------------------------
   TERMINOLOGIA DE AUDITORIA
   --------------------------------------------------------- */

.filters-panel select:disabled{
    color:#6f7d86 !important;

    font-style:normal;

    opacity:.72 !important;
}

/* ---------------------------------------------------------
   RESPONSIVIDADE GEOMÉTRICA
   NÃO DIMINUIR DEMAIS AS FONTES
   --------------------------------------------------------- */

@media (max-width:1500px){

    .topbar{
        grid-template-columns:
            200px
            minmax(0,1fr) !important;
    }

    .header-message .hero-copy h1{
        font-size:24px !important;
    }

    .header-message .hero-copy p{
        font-size:10px !important;
    }

    .top-kpi-card strong{
        font-size:19px !important;
    }
}

