/* CRM CPM · Tema "blanco · negro · verde"
   Lienzo blanco cálido, superficies blancas con borde fino y sombra suave, chrome negro (píldora de navegación),
   verde CPM reservado para acción, estado y énfasis. Se carga después de app.css. */
:root{
  --verde:#00833D; --verde-2:#0FA653; --verde-oscuro:#005C2A; --verde-tinte:#E7F4EC; --verde-tinte-2:#CFEBDA;
  --ambar:#B8860B; --ambar-tinte:#FBF1D2; --rojo:#D13B2E; --rojo-tinte:#FBE7E4;
  --negro:#0E1512; --negro-2:#1A221D;
  --tinta:#0E1512; --tinta-2:#4F5B55; --tinta-3:#86928C; --tinta-4:#B9C2BD;
  --lienzo:#F6F7F5; --superficie:#FFFFFF; --superficie-2:#F2F4F2; --superficie-3:#E9EDEA;
  --linea:rgba(14,21,18,.08); --linea-2:rgba(14,21,18,.14); --borde-luz:rgba(255,255,255,.9);
  --vidrio:rgba(255,255,255,.72); --vidrio-oscuro:rgba(14,21,18,.88);
  --r-s:12px; --r:18px; --r-l:26px;
  --sombra-s:0 1px 2px rgba(14,21,18,.04), 0 6px 20px -12px rgba(14,21,18,.18);
  --sombra:0 2px 6px rgba(14,21,18,.05), 0 24px 60px -24px rgba(14,21,18,.28);
  --blur:blur(20px) saturate(160%);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ color-scheme:light } }

html{min-height:100%}
body{background:
  radial-gradient(900px 500px at 8% -8%, rgba(0,131,61,.10), transparent 60%),
  radial-gradient(700px 420px at 100% 100%, rgba(0,131,61,.07), transparent 60%),
  var(--lienzo); background-attachment:fixed; color:var(--tinta)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.028'/%3E%3C/svg%3E")}
#app,#login{position:relative;z-index:1}

/* ---------- Superficies ---------- */
.sheet,.card,.login .card,.tabs,.sugs{background:var(--superficie);border:1px solid var(--linea);box-shadow:var(--sombra-s);position:relative}
.as-panel{background:var(--vidrio);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);box-shadow:var(--sombra)}
.card{border-radius:var(--r)}
.sheet{border-radius:var(--r);overflow:visible}
.sheet > .row:first-child{border-top-left-radius:var(--r);border-top-right-radius:var(--r)}
.sheet > .row:last-child{border-bottom-left-radius:var(--r);border-bottom-right-radius:var(--r)}
.card:hover{border-color:var(--linea-2)}

/* ---------- Topbar negra en píldora ---------- */
.topbar{position:sticky;top:calc(10px + env(safe-area-inset-top,0px));margin:10px auto 0;max-width:1240px;border-radius:999px;background:var(--vidrio-oscuro);
  backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border:1px solid rgba(255,255,255,.08);box-shadow:0 20px 50px -20px rgba(14,21,18,.6);padding:8px 14px 8px 10px;color:#fff;width:calc(100% - 32px)}
.topbar .brand .mark{box-shadow:0 0 0 1px rgba(255,255,255,.14)}
.topbar .who b{color:#fff}
.topbar .who span{color:rgba(255,255,255,.65)}

/* ---------- Tipografía ---------- */
body{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter",system-ui,Segoe UI,Roboto,sans-serif}
h1{font-size:34px;font-weight:700;letter-spacing:-.035em;color:var(--negro)}
#secTitle{font-size:36px!important}
h2{font-weight:650;color:var(--negro);letter-spacing:-.02em}
.eyebrow{color:var(--tinta-3)}
.sub{color:var(--tinta-2)}

/* ---------- KPIs ---------- */
.kpi .card{padding:18px 20px;border-radius:var(--r);display:flex;flex-direction:column;gap:2px;min-height:124px}
.kpi .lbl{color:var(--tinta-2);font-weight:500;order:2;font-size:12.5px}
.kpi .val{font-size:34px;font-weight:700;letter-spacing:-.04em;color:var(--negro);order:1;margin:0}
.kpi .delta{order:3;color:var(--tinta-3)}
.kpi .card.hi{background:var(--negro);border-color:var(--negro);color:#fff}
.kpi .card.hi .val{color:#fff}
.kpi .card.hi .val:after{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--verde-2);margin-left:10px;vertical-align:middle;box-shadow:0 0 14px rgba(15,166,83,.9)}
.kpi .card.hi .lbl,.kpi .card.hi .delta{color:rgba(255,255,255,.7)}
.kpi .card:hover{transform:translateY(-3px);box-shadow:var(--sombra)}

/* ---------- Controles ---------- */
input[type=text],input[type=tel],input[type=email],input[type=date],input[type=number],input[type=password],select,textarea{
  background:var(--superficie-2);border-color:var(--linea-2);color:var(--tinta);border-radius:12px}
input::placeholder{color:var(--tinta-4)}
input:focus,select:focus,textarea:focus{background:#fff;border-color:var(--verde);box-shadow:0 0 0 4px rgba(0,131,61,.14)}
select{background-repeat:no-repeat;background-position:right 14px center;background-size:14px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%234F5B55' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}
.seg{background:var(--superficie-2);border:1px solid var(--linea);border-radius:12px}
.seg span{color:var(--tinta-2)}
.seg input:checked + span{background:var(--negro);color:#fff;box-shadow:0 4px 12px -4px rgba(14,21,18,.5)}
.chip span{background:var(--superficie-2);border-color:transparent;color:var(--tinta)}
.chip span small{color:var(--tinta-3)}
.chip span i{border-color:var(--tinta-4);background:#fff}
.chip input:checked + span{background:var(--verde-tinte);border-color:var(--verde);color:var(--verde-oscuro);box-shadow:0 0 0 1px var(--verde)}
.chip input:checked + span small{color:var(--verde)}
.check{background:var(--superficie-2);border-color:transparent}
.check input{background:#fff;border-color:var(--tinta-4)}
.check p{color:var(--tinta-2)}
.check.on{background:var(--verde-tinte);border-color:var(--verde-tinte-2)}
.check.on p{color:var(--tinta)}
.row{border-bottom-color:var(--linea)}
.row > label.t{color:var(--negro)}
.row > label.t .req{color:var(--verde)}
.btn.primary{background:var(--verde);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 10px 24px -10px rgba(0,131,61,.6)}
.btn.primary:hover{background:var(--verde-2)}
.btn.ghost{background:#fff;border-color:var(--linea-2);color:var(--tinta)}
.btn.ghost:hover{background:var(--superficie-2)}
.btn.accent{background:var(--negro);color:#fff}
.status-pill{background:#fff;border-color:var(--linea);color:var(--tinta-2)}
.status-pill.ok{background:var(--verde-tinte);color:var(--verde-oscuro);border-color:transparent}
.status-pill.off{background:var(--ambar-tinte);color:#6B4A00;border-color:transparent}
.tag{background:var(--verde-tinte);color:var(--verde-oscuro)}
.banner.ok{background:var(--verde-tinte);color:var(--verde-oscuro)}
.banner.warn{background:var(--ambar-tinte);color:#6B4A00}
.banner.err{background:var(--rojo-tinte);color:#7A1F1A}
.actionbar{background:var(--vidrio);border-top-color:var(--linea)}
.actionbar .meta{color:var(--tinta-3)}
.toast{background:var(--negro);color:#fff}
.done .ring{background:var(--verde-tinte);box-shadow:0 0 0 10px rgba(0,131,61,.08)}
.done .ring svg{stroke:var(--verde)}
.list .it{border-bottom-color:var(--linea)}
.list .it b{color:var(--negro)}
.group:focus-within .sheet{box-shadow:0 0 0 1px rgba(0,131,61,.35),var(--sombra)}

/* ---------- Tablas, filtros ---------- */
.filters .field label{color:var(--tinta-2)}
table.data th{color:var(--tinta-3);border-bottom-color:var(--linea-2);background:#fff}
table.data td{border-bottom-color:var(--linea);color:var(--tinta)}
table.data tr:hover td{background:var(--superficie-2)}
table.data td b{color:var(--negro)}
.table-scroll{border-radius:14px}
.bar{background:var(--superficie-3)}
.bar i{background:var(--verde)}
.bar.warn i{background:var(--ambar)}
.bar.err i{background:var(--rojo)}
#map{border-color:var(--linea-2)}
.leaflet-container{background:var(--superficie-2)}
.sep{border-top-color:var(--linea)}
.muted{color:var(--tinta-3)}

/* ---------- Login ---------- */
.login{background:transparent}
.login .card{border-radius:var(--r-l);box-shadow:var(--sombra)}
.login .logo .mark{box-shadow:0 20px 40px -16px rgba(0,131,61,.5)}
.login .logo div b{color:var(--negro)}
.login .field label{color:var(--tinta-2)}
.err-msg{color:var(--rojo)}
.as-sug{background:#fff;border-color:var(--linea-2);color:var(--verde-oscuro)}

/* ---------- Asistente ---------- */
.as-panel{border-left:1px solid var(--linea)}
.as-head{background:linear-gradient(180deg,var(--verde-tinte),transparent);border-bottom-color:var(--linea)}
.as-title b{color:var(--negro)}
.as-close{background:var(--superficie-2);color:var(--tinta-2)}
.as-msgs{background:transparent}
.as-m.bot{background:#fff;color:var(--tinta);border:1px solid var(--linea);box-shadow:var(--sombra-s)}
.as-m.me{background:var(--negro);color:#fff}
.as-bubble{background:var(--negro);color:#fff}
.as-bubble:after{background:var(--negro)}
.cj-shadow{background:rgba(14,21,18,.25)}

*{scrollbar-width:thin;scrollbar-color:rgba(14,21,18,.18) transparent}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:rgba(14,21,18,.18);border-radius:8px}
@media (prefers-reduced-transparency: reduce){ .as-panel,.topbar,.actionbar{backdrop-filter:none;-webkit-backdrop-filter:none} .as-panel,.actionbar{background:#fff} .topbar{background:var(--negro)} }

/* ---------- Navegación superior en píldora ---------- */
.topbar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:6px 8px 6px 8px;transition:padding .3s var(--spring),transform .3s var(--spring),box-shadow .3s}
body.scrolled .topbar{padding:4px 8px;box-shadow:0 20px 50px -20px rgba(0,0,0,.8)}
.topbar .brand{padding-left:4px}
.topbar .brand .mark{width:36px;height:36px;transition:transform .3s var(--spring)}
body.scrolled .topbar .brand .mark{transform:scale(.92)}
.topbar .brand > div:last-child{transition:opacity .25s}
.pnav{position:relative;display:flex;align-items:center;gap:2px;justify-self:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:4px;max-width:100%;overflow:auto;scrollbar-width:none}
.pnav::-webkit-scrollbar{display:none}
.pnav-ind{position:absolute;left:0;top:4px;bottom:4px;width:0;border-radius:999px;background:rgba(255,255,255,.16);box-shadow:0 1px 0 rgba(255,255,255,.12) inset;transition:transform .35s cubic-bezier(.22,.9,.26,1.02),width .35s cubic-bezier(.22,.9,.26,1.02);pointer-events:none}
.pnav-item{position:relative;z-index:1;display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;color:rgba(255,255,255,.7);text-decoration:none;font-size:13.5px;font-weight:600;white-space:nowrap;transition:color .2s,transform .12s var(--spring)}
.pnav-item svg{width:16px;height:16px;transition:transform .25s var(--spring)}
.pnav-item:hover{color:#fff}
.pnav-item:hover svg{transform:translateY(-1px) scale(1.08)}
.pnav-item:active{transform:scale(.95)}
.pnav-item.on{color:#fff}
.pnav-item.on svg{color:var(--verde-2);filter:drop-shadow(0 0 6px rgba(25,194,102,.8))}
.pnav-user{display:flex;align-items:center;gap:10px;padding-right:2px}
.pnav-avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(140deg,#19C266,#00833D);color:#fff;display:grid;place-items:center;font-weight:700;font-size:12px;letter-spacing:.02em;box-shadow:0 0 18px -4px rgba(25,194,102,.8)}
.pnav-txt{text-align:left;line-height:1.2}
.pnav-txt b{display:block;font-size:13px;color:#fff;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pnav-txt small{font-size:11.5px;color:rgba(255,255,255,.6)}
.pnav-out{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.08);color:rgba(255,255,255,.8);display:grid;place-items:center;cursor:pointer;transition:all .2s var(--spring)}
.pnav-out svg{width:16px;height:16px}
.pnav-out:hover{background:rgba(255,107,92,.18);color:#FFB3A8;border-color:transparent}
.pnav-out:active{transform:scale(.92)}
.topbar .who{display:block}
@media(max-width:900px){ .pnav-item span{display:none} .pnav-item{padding:9px 11px} .pnav-txt{display:none} .topbar .brand > div:last-child{display:none} }
@media(max-width:640px){ .topbar{grid-template-columns:auto 1fr auto;width:calc(100% - 20px);padding:5px 6px} }
.sn-burger{display:none!important}
body.has-sn .topbar,body.has-sn .wrap,body.has-sn .actionbar{margin-left:auto}
body.has-sn .actionbar{left:0}
body.has-sn .topbar{width:calc(100% - 32px)}
.wrap{padding-top:22px}

/* ---------- Animación global ágil ---------- */
.sheet,.card,.kpi .card{animation:rise .55s cubic-bezier(.22,.9,.26,1.02) both}
.grid.two > .card:nth-child(1){animation-delay:.08s}.grid.two > .card:nth-child(2){animation-delay:.14s}.grid.two > .card:nth-child(3){animation-delay:.2s}.grid.two > .card:nth-child(4){animation-delay:.26s}
@keyframes rise{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
section[id^=tab-].enter{animation:secin .45s cubic-bezier(.22,.9,.26,1.02) both}
@keyframes secin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
#secTitle.enter{animation:titlein .4s cubic-bezier(.22,.9,.26,1.02) both}
@keyframes titlein{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
.row input,.row select{transition:border-color .18s,box-shadow .18s,background .18s,transform .12s}
.row input:focus,.row select:focus{transform:translateY(-1px)}
table.data tbody tr{animation:rowin .35s both}
table.data tbody tr:nth-child(-n+12){animation-delay:calc(var(--i,0) * 20ms)}
@keyframes rowin{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.btn{transition:transform .12s var(--spring),background .18s,box-shadow .18s,filter .18s}
.btn:hover{filter:brightness(1.06)}
.btn.primary:active{box-shadow:0 2px 8px -4px rgba(25,194,102,.6)}
.status-pill{animation:rise .5s cubic-bezier(.22,.9,.26,1.02) both}
.bar i{transition:width .7s cubic-bezier(.22,.9,.26,1.02)}
@media (prefers-reduced-motion: reduce){ .sheet,.card,.kpi .card,section[id^=tab-].enter,#secTitle.enter,table.data tbody tr,.status-pill{animation:none} .pnav-ind{transition:none} }
.grid.kpi{align-items:stretch}
.kpi .card{min-height:124px;justify-content:flex-start}
.kpi .card:first-child{animation-delay:0s}

/* ---------- FX ---------- */
.fx-confetti{position:fixed;inset:0;pointer-events:none;z-index:70}
.fx-pop{position:fixed;inset:0;z-index:65;display:grid;place-items:center;pointer-events:none;background:rgba(4,18,11,0);transition:background .3s}
.fx-pop.on{background:rgba(14,21,18,.35);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.fx-pop-card{background:#fff;border:1px solid var(--linea);border-radius:26px;padding:28px 30px 26px;text-align:center;min-width:min(86vw,320px);box-shadow:var(--sombra);transform:scale(.7) translateY(20px);opacity:0;transition:transform .5s cubic-bezier(.2,1.4,.3,1),opacity .25s}
.fx-pop.on .fx-pop-card{transform:none;opacity:1}
.fx-pop-card b{display:block;font-size:19px;letter-spacing:-.02em;color:var(--negro);margin-top:14px}
.fx-pop-card small{display:block;color:var(--tinta-2);font-size:13.5px;margin-top:6px}
.fx-pop-ring{width:84px;height:84px;border-radius:50%;margin:0 auto;background:radial-gradient(circle at 35% 30%,#2BD276,#00833D);display:grid;place-items:center;box-shadow:0 0 0 10px rgba(25,194,102,.15),0 0 60px -8px rgba(25,194,102,.9);animation:fxring .6s cubic-bezier(.2,1.4,.3,1) .1s both}
@keyframes fxring{from{transform:scale(.3)}to{transform:scale(1)}}
.fx-pop-ring svg{width:40px;height:40px;fill:none;stroke:#fff;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.fx-check{stroke-dasharray:30;stroke-dashoffset:30;animation:fxcheck .45s ease-out .35s forwards}
@keyframes fxcheck{to{stroke-dashoffset:0}}
.btn{overflow:hidden;position:relative}
.fx-ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.35);transform:scale(0);animation:fxripple .6s ease-out forwards;pointer-events:none}
@keyframes fxripple{to{transform:scale(1);opacity:0}}
.fx-sound{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.08);color:rgba(255,255,255,.8);display:grid;place-items:center;cursor:pointer;margin-right:8px;transition:all .2s var(--spring)}
.fx-sound svg{width:16px;height:16px}
.fx-sound:hover{color:#fff;background:rgba(255,255,255,.1)}
.pnav-user{display:flex;align-items:center}
.fx-sound{order:-1}
@media (prefers-reduced-motion: reduce){ .fx-pop-card,.fx-pop-ring,.fx-check{animation:none;transition:none;transform:none;opacity:1;stroke-dashoffset:0} }

.fx-menu{position:absolute;top:calc(100% + 10px);right:60px;background:#fff;backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border:1px solid var(--linea-2);border-radius:14px;padding:8px;box-shadow:var(--sombra);z-index:30;min-width:160px;animation:rise .25s var(--spring) both}
.fx-menu-t{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--tinta-3);padding:4px 8px 6px}
.fx-menu button{display:block;width:100%;text-align:left;background:none;border:0;color:var(--tinta);padding:8px 10px;border-radius:9px;cursor:pointer;font-size:13.5px;font-weight:500}
.fx-menu button:hover{background:var(--superficie-2)}
.fx-menu button.on{background:var(--verde-tinte);color:var(--verde-oscuro);font-weight:600}
.topbar{overflow:visible}
.pnav-user{position:relative}

/* ---------- Avatar 3D ---------- */
.cj3d{width:84px;height:94px;pointer-events:auto}
.cj3d canvas{display:block}
.as-fab{width:84px;height:94px}
.as-fab .cj3d{position:absolute;inset:0}
.as-avatar-big{width:68px;height:76px}
.as-avatar-big .cj3d.big{width:68px;height:76px}
.as-bubble{right:92px}

/* ---------- Pantalla completa (dashboard) ---------- */
.wrap.wide{max-width:none;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.topbar{max-width:none;width:calc(100% - 40px)}
body.has-sn .topbar{width:calc(100% - 40px)}
.wrap.wide .grid.kpi{grid-template-columns:repeat(6,minmax(0,1fr))}
@media(max-width:1400px){.wrap.wide .grid.kpi{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.wrap.wide .grid.kpi{grid-template-columns:repeat(2,minmax(0,1fr))}}
.wrap.wide .grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:1600px){.wrap.wide .grid.two{grid-template-columns:repeat(4,minmax(0,1fr))} .wrap.wide .grid.two > .card.span2{grid-column:span 2}}
@media(max-width:860px){.wrap.wide .grid.two{grid-template-columns:1fr}}
.chart-box{height:clamp(240px,32vh,420px)}
#map{height:clamp(420px,62vh,820px)}
.table-scroll{max-height:clamp(420px,62vh,900px)}
/* interacción en datos */
.card.clickable{cursor:pointer}
.chart-hint{font-size:12px;color:var(--tinta-3);margin-left:8px;font-weight:500}
.filter-chips{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}
.fchip{display:inline-flex;align-items:center;gap:6px;background:var(--negro);color:#fff;border-radius:999px;padding:5px 10px 5px 12px;font-size:12.5px;font-weight:600;animation:rise .3s var(--spring) both}
.fchip b{opacity:.65;font-weight:500}
.fchip button{background:rgba(255,255,255,.18);border:0;color:#fff;width:18px;height:18px;border-radius:50%;cursor:pointer;font-size:12px;line-height:1;display:grid;place-items:center}
table.data tbody tr{cursor:default}
table.data tbody tr.sel td{background:var(--verde-tinte)}
.kpi .card.active{outline:2px solid var(--verde);outline-offset:2px}

@media(min-width:1600px){.wrap.wide .grid.two > .card:nth-child(1){grid-column:span 1} .wrap.wide .grid.two > .card:nth-child(2){grid-column:span 2} .wrap.wide .grid.two > .card:nth-child(3){grid-column:span 1} .wrap.wide .grid.two > .card:nth-child(4){grid-column:span 4}}
.grid.kpi .card{animation-delay:.05s}
.grid.kpi .card:nth-child(1){animation-delay:.05s}.grid.kpi .card:nth-child(2){animation-delay:.1s}.grid.kpi .card:nth-child(3){animation-delay:.15s}.grid.kpi .card:nth-child(4){animation-delay:.2s}.grid.kpi .card:nth-child(5){animation-delay:.25s}.grid.kpi .card:nth-child(6){animation-delay:.3s}

/* ---------- Formulario a lo ancho en escritorio ---------- */
@media(min-width:1024px){
  .wrap:not(.wide){max-width:none;padding-left:max(28px,env(safe-area-inset-left,0px));padding-right:max(28px,env(safe-area-inset-right,0px))}
  #regForm{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);column-gap:24px;align-items:start}
  #regForm > .group:first-child{grid-column:1 / -1;display:grid;grid-template-columns:1fr auto;align-items:end;gap:20px}
  #regForm > .group:first-child h1{font-size:40px;max-width:900px}
  #regForm > .group:first-child .sub{max-width:900px}
  #regForm > .group:nth-child(2){grid-column:1 / -1}
  /* columna izquierda: Participante (alta). Derecha: meta, plazo, contacto, dinámica apilados */
  #regForm > .group:nth-child(3){grid-column:1;grid-row:3 / span 6}
  #regForm > .group:nth-child(n+4){grid-column:2}
  #regForm .chips{grid-template-columns:repeat(2,minmax(0,1fr))}
  #regForm > #formErr,#regForm > p.muted{grid-column:1 / -1}
  .pickmap{height:260px}
  .actionbar .in{max-width:none;padding:0 12px}
  .actionbar .in .btn{flex:0 0 360px;margin-left:auto}
  .wrap > .group{max-width:none}
  .group{margin-top:18px}
}

/* Ajustes móvil · sin desbordes horizontales */
html,body{max-width:100%;overflow-x:hidden}
.card{max-width:100%;min-width:0}
input[type=date]{-webkit-appearance:none;appearance:none;display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box;text-align:left}
input[type=date]::-webkit-date-and-time-value{text-align:left}
.filters .field{min-width:0}
@media (max-width:760px){
  .card:has(table){overflow-x:auto;-webkit-overflow-scrolling:touch}
  .card table{min-width:560px}
  .pnav{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .pnav::-webkit-scrollbar{display:none}
}

.maplink{display:inline-flex;align-items:center;margin-top:4px;font-size:12.5px;font-weight:600;color:var(--verde);text-decoration:none;white-space:nowrap}
.maplink:hover{text-decoration:underline}

/* Composición verde · blanco · negro */
.wrap.wide > .inline:first-child,#regForm > .group:first-child{position:relative;overflow:hidden;background:linear-gradient(135deg,#00833D 0%,#00682F 62%,#0E1512 135%);color:#fff;border-radius:var(--r-l);padding:22px 22px 24px;box-shadow:0 18px 40px -22px rgba(0,104,47,.7);margin-bottom:16px!important}
.wrap.wide > .inline:first-child:after,#regForm > .group:first-child:after{content:"";position:absolute;right:-34px;bottom:-56px;width:170px;height:170px;background:url(logo-white.png) center/contain no-repeat;opacity:.08;pointer-events:none}
.wrap.wide > .inline:first-child h1,#regForm > .group:first-child h1{color:#fff;position:relative;z-index:1}
.wrap.wide > .inline:first-child .muted,#regForm > .group:first-child .sub{color:rgba(255,255,255,.82);position:relative;z-index:1}
.gh .eyebrow{text-transform:none;letter-spacing:-.01em;font-size:15px;font-weight:700;color:var(--tinta);display:inline-flex;align-items:center;gap:8px}
.gh .eyebrow:before{content:"";width:4px;height:16px;border-radius:2px;background:var(--verde)}
.kpi .card:first-child{background:var(--verde);border-color:var(--verde);color:#fff}
.kpi .card:first-child .val{color:#fff}
.kpi .card:first-child .lbl,.kpi .card:first-child .delta{color:rgba(255,255,255,.78)}
table.data th{background:var(--negro);color:rgba(255,255,255,.88);border-bottom:0}
table.data th:first-child{border-top-left-radius:10px;border-bottom-left-radius:10px}
table.data th:last-child{border-top-right-radius:10px;border-bottom-right-radius:10px}
#btnCsv{background:var(--negro);color:#fff;border-color:var(--negro)}
.status-pill{white-space:nowrap}
.card h3{display:flex;align-items:center;gap:8px}
.card h3:before{content:"";width:4px;height:15px;border-radius:2px;background:var(--verde);flex:none}