/* Panel de visitas · La Bocatoma. Una sola tinta en los gráficos (azul de la marca) y el resto en neutros; el dorado y el rojo solo puntúan. */
:root{color-scheme:light;--bg:#FFFBF0;--card:#fff;--ink:#1B1008;--muted:rgba(27,16,8,.68);--faint:rgba(27,16,8,.46);--line:rgba(27,16,8,.12);--grid:rgba(27,16,8,.09);
  --bar:#1D3FA0;--bar-soft:#9fb1e6;--bar-bg:#e9edf8;--gold:#FFD21F;--red:#D8281F;--ok:#15803d;--warn-bg:#FFF0B8;--shadow:0 1px 0 rgba(27,16,8,.04)}
@media (prefers-color-scheme:dark){:root:where(:not([data-theme="light"])){color-scheme:dark;--bg:#14100b;--card:#1e1810;--ink:#f6efe0;--muted:rgba(246,239,224,.72);--faint:rgba(246,239,224,.5);--line:rgba(246,239,224,.14);--grid:rgba(246,239,224,.1);
  --bar:#7f9bff;--bar-soft:#3b4a85;--bar-bg:#262d4a;--warn-bg:#3a3010;--ok:#4ade80}}
*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font:500 16px/1.45 Barlow,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:Anton,Impact,sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.01em;line-height:1.05}
.top{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top::before{content:"";display:block;height:6px;background:linear-gradient(var(--gold) 0 33.3%,#1D3FA0 33.3% 66.6%,var(--red) 66.6%)}
.top__in{max-width:1120px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.top__logo{height:44px;width:auto}
.top__t{flex:1;min-width:160px}.top__t h1{font-size:26px}.top__t p{font-size:14px;color:var(--muted)}
.chips{display:flex;gap:6px}.chips button{font:700 14px Barlow,sans-serif;padding:8px 14px;border-radius:999px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;min-height:40px}
.chips button.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.chips button:focus-visible,.btn:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.wrap{max-width:1120px;margin:0 auto;padding:18px 16px 60px;display:grid;gap:18px}
.banner{background:var(--warn-bg);border:1.5px solid var(--gold);border-radius:14px;padding:12px 16px;display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-weight:600}
.banner button{margin-left:auto}
.btn{font:700 14px Barlow,sans-serif;padding:9px 16px;border-radius:999px;border:0;background:var(--ink);color:var(--bg);cursor:pointer;min-height:40px}
.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:760px){.kpis{grid-template-columns:repeat(3,1fr)}}@media(min-width:1000px){.kpis{grid-template-columns:repeat(6,1fr)}}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:var(--shadow)}
.kpi b{display:block;font:400 clamp(30px,5vw,40px)/1 Anton,sans-serif;letter-spacing:.01em}
.kpi span{display:block;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:6px}
.kpi small{display:block;font-size:13px;color:var(--faint);margin-top:2px}
.sum{display:grid;gap:8px;padding:0;list-style:none}.sum li{display:flex;gap:10px;font-size:17px;font-weight:600}.sum li::before{content:"";flex:none;width:9px;height:9px;border-radius:50%;background:var(--gold);margin-top:8px}
.sum b{font-weight:800}
.grid2{display:grid;gap:18px;align-items:start}.stack{display:grid;gap:18px}@media(min-width:900px){.grid2{grid-template-columns:1fr 1fr}}
.card h2{font-size:22px;margin-bottom:4px}.card .sub{font-size:14px;color:var(--muted);margin-bottom:14px}
/* barras verticales */
.cols{display:flex;align-items:flex-end;gap:3px;height:190px;position:relative;padding-top:6px;background:repeating-linear-gradient(to top,var(--grid) 0 1px,transparent 1px 25%) 0 0/100% 100%}
.col{flex:1;height:100%;display:flex;align-items:flex-end;cursor:default;min-width:0;position:relative}
.col i{display:block;width:100%;background:var(--bar);border-radius:4px 4px 0 0;min-height:2px}
.col.max i{background:var(--ink)}.col:hover i,.col:focus-visible i{filter:brightness(1.25)}
.axis{display:flex;gap:3px;margin-top:6px;font-size:12px;color:var(--faint)}.axis span{flex:1;text-align:center;white-space:nowrap;overflow:visible;min-width:0}
.ymax{position:absolute;left:0;top:-2px;font-size:11px;color:var(--faint)}
/* barras horizontales */
.hb{display:grid;gap:10px}.hb .r{display:grid;grid-template-columns:minmax(120px,42%) 1fr auto;gap:10px;align-items:center;font-size:15px}
.hb .l{font-weight:700;line-height:1.15}.hb .l small{display:block;font-weight:500;color:var(--faint);font-size:12px;line-height:1.25;margin-top:1px}
.hb .t{height:14px;background:var(--bar-bg);border-radius:7px;overflow:hidden}.hb .t i{display:block;height:100%;background:var(--bar);border-radius:7px}
.hb .v{font-weight:800;min-width:2.6em;text-align:right}.hb .v small{font-weight:500;color:var(--faint)}
/* recorrido por la página */
.flow{display:grid;gap:8px}.sec{display:grid;grid-template-columns:1fr;gap:8px 14px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--bar-bg);background:color-mix(in srgb,var(--bar) calc(var(--heat,0)*22%),var(--card))}
.sec h3{font-size:19px}.sec .m{display:flex;gap:14px;flex-wrap:wrap;font-size:14px;color:var(--muted)}.sec .m b{color:var(--ink);font-weight:800}
.sec .t{height:10px;background:var(--bar-bg);border-radius:6px;overflow:hidden}.sec .t i{display:block;height:100%;background:var(--bar);border-radius:6px}
.tag{display:inline-block;font:800 11px Barlow,sans-serif;letter-spacing:.08em;text-transform:uppercase;background:var(--gold);color:#1B1008;border-radius:999px;padding:2px 9px;margin-left:8px;vertical-align:middle}
/* embudo */
.fun{display:grid;gap:8px}.fun .r{display:grid;grid-template-columns:minmax(120px,38%) 1fr;gap:10px;align-items:center}.fun .l{font-weight:700;font-size:15px;line-height:1.15}
.fun .t{height:30px;background:var(--bar-bg);border-radius:8px;position:relative;overflow:hidden}.fun .t i{display:block;height:100%;background:var(--bar);border-radius:8px}
.fun .t b{position:absolute;left:10px;top:50%;transform:translateY(-50%);font-weight:800;font-size:14px;color:#fff;mix-blend-mode:normal;text-shadow:0 0 3px rgba(0,0,0,.45)}
.fun .t em{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-style:normal;font-size:12px;font-weight:700;color:var(--muted)}
details.tbl{margin-top:14px;font-size:14px}details.tbl summary{cursor:pointer;color:var(--muted);font-weight:700;min-height:32px;display:flex;align-items:center}
details.tbl table{width:100%;border-collapse:collapse;margin-top:6px}details.tbl td,details.tbl th{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;font-weight:500}details.tbl th{font-weight:800;color:var(--muted)}details.tbl td:last-child,details.tbl th:last-child{text-align:right}
.empty{padding:40px 16px;text-align:center;color:var(--muted)}.empty h2{font-size:28px;color:var(--ink);margin-bottom:8px}
.note{font-size:13px;color:var(--faint);line-height:1.5}
.tip{position:fixed;z-index:50;pointer-events:none;background:var(--ink);color:var(--bg);font:700 13px/1.3 Barlow,sans-serif;padding:7px 10px;border-radius:8px;max-width:240px;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.login{position:fixed;inset:0;z-index:60;background:var(--bg);display:grid;place-items:center;padding:20px}.login[hidden]{display:none}
.login form{width:min(360px,100%);display:grid;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px}.login h2{font-size:30px}
.login input{font:500 17px Barlow,sans-serif;padding:12px 14px;border-radius:12px;border:1.5px solid var(--line);background:var(--bg);color:var(--ink);min-height:48px}.login small{color:var(--red);font-weight:700}
@media (prefers-reduced-motion:no-preference){.col i,.hb .t i,.fun .t i,.sec .t i{transition:width .5s,height .5s}}
