/* Panel de Admósfera — paleta de la casa (8_marca/Admósfera/paleta.json) */
:root{
  --fondo:#F5F9FB; --papel:#FFFFFF; --tinta:#2B2B2B; --suave:#56646E; --linea:#E3ECF1;
  --acento:#3A9AD9; --acento-tinta:#1B4F72; --aire:#7EC8E3; --bruma:#EAF6FB;
  --sol:#FFB400; --sol-tinta:#8A5A00; --sol-fondo:#FFF6DC;
  --ok:#2E8B57; --ok-fondo:#EAF6EE; --foco:#C0392B; --foco-fondo:#FDECEA;
  --sombra:0 1px 3px rgba(27,79,114,.08); --sombra-alta:0 6px 20px rgba(27,79,114,.12);
  --radio:12px;
}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){
  --fondo:#0F1A22; --papel:#16232C; --tinta:#E8EEF2; --suave:#9BAAB5; --linea:#26363F;
  --acento:#6FB8E8; --acento-tinta:#BFE0F5; --bruma:#1B2E3A;
  --sol:#FFC43D; --sol-tinta:#FFD976; --sol-fondo:#3A3012;
  --ok:#6FD39B; --ok-fondo:#1B3327; --foco:#FF8A7A; --foco-fondo:#3A1F1C;
  --sombra:none; --sombra-alta:0 6px 20px rgba(0,0,0,.4);
}}
:root[data-theme="dark"]{
  --fondo:#0F1A22; --papel:#16232C; --tinta:#E8EEF2; --suave:#9BAAB5; --linea:#26363F;
  --acento:#6FB8E8; --acento-tinta:#BFE0F5; --bruma:#1B2E3A;
  --sol:#FFC43D; --sol-tinta:#FFD976; --sol-fondo:#3A3012;
  --ok:#6FD39B; --ok-fondo:#1B3327; --foco:#FF8A7A; --foco-fondo:#3A1F1C;
  --sombra:none; --sombra-alta:0 6px 20px rgba(0,0,0,.4);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--fondo);color:var(--tinta);font-family:Roboto,'Segoe UI',Arial,sans-serif;
     font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--acento);text-decoration:none}
h1,h2,h3{margin:0;font-weight:900;letter-spacing:-.01em}
.pantalla[hidden]{display:none!important}
.env{max-width:1180px;margin:0 auto;padding:24px 16px 56px}
.sutil{color:var(--suave);font-size:13.5px}

/* marca: el logo de Admósfera (8_marca/Admósfera) */
.marca{display:flex;align-items:center;gap:12px;color:inherit}
.marca picture{display:flex}
.marca-logo{height:30px;width:auto;display:block}
.marca-sub{color:var(--suave);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;
  border-left:1px solid var(--linea);padding-left:12px;line-height:1.2}

/* entrada: la cara pública del holding */
.entrada{min-height:100dvh;padding:28px 16px 20px;
  background:radial-gradient(ellipse 70% 50% at 85% 0%,var(--sol-fondo),transparent 70%),var(--fondo)}
.ent-env{max-width:1120px;margin:0 auto;display:flex;flex-direction:column;min-height:calc(100dvh - 48px)}
.ent-cabeza{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.ent-cabeza picture{display:flex}
.ent-logo{height:58px;width:auto;display:block}
.ent-razon{color:var(--suave);font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  border-left:1px solid var(--linea);padding-left:16px}
.ent-cuerpo{flex:1;display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:56px;
  align-items:center;padding:40px 0}
.ent-historia h1{font-size:40px;line-height:1.1;letter-spacing:-.02em;max-width:21ch;margin-bottom:16px}
.ent-historia h1 span{color:var(--suave);font-weight:700}
.ent-historia>p{color:var(--suave);font-size:16px;max-width:58ch;margin:0 0 28px}
.ent-series{list-style:none;margin:0;padding:0;display:grid;gap:12px;
  grid-template-columns:repeat(4,minmax(0,1fr))}
.ent-series li{display:flex;flex-direction:column;gap:2px;font-size:12.5px;color:var(--suave)}
.ent-series b{color:var(--tinta);font-size:13.5px;margin-top:8px}
/* los logos van siempre sobre blanco, también en modo oscuro: así se ven como son */
.ent-logo-serie{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);
  aspect-ratio:1/1;position:relative;box-shadow:var(--sombra);overflow:hidden}
.ent-logo-serie img{position:absolute;inset:16%;width:68%;height:68%;object-fit:contain;display:block}
.ent-casa{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:26px;
  padding-top:18px;border-top:1px solid var(--linea)}
.ent-casa span{font-size:12.5px;font-weight:700;padding:4px 11px;border-radius:999px;
  background:var(--sol-fondo);color:var(--sol-tinta)}
.ent-casa .ent-casa-t{background:none;color:var(--suave);padding:4px 4px 4px 0;font-weight:400}
.ent-pie{color:var(--suave);font-size:12px;text-align:center;padding-top:12px}
.caja-entrada{background:var(--papel);border:1px solid var(--linea);border-radius:16px;
  box-shadow:var(--sombra-alta);padding:28px;width:100%}
.caja-entrada h2{font-size:20px}
/* el botón toma los colores del logo: negro con el ámbar al pasar */
.caja-entrada .btn.primario{background:var(--tinta);color:var(--papel)}
.caja-entrada .btn.primario:hover{filter:none;background:var(--sol);color:#030505}
.caja-entrada .enlace{color:var(--sol-tinta)}
.caja-entrada>.sutil{margin:4px 0 20px}
.campo-clave{position:relative;display:block}
.campo-clave input{padding-right:84px}
.ver-clave{position:absolute;right:6px;top:calc(50% + 2.5px);transform:translateY(-50%);
  background:none;border:0;border-radius:7px;padding:6px 10px;cursor:pointer;font:inherit;
  font-size:12.5px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--sol-tinta)}
.ver-clave:hover{background:var(--sol-fondo)}
.caja-entrada label{display:block;font-size:12.5px;font-weight:700;color:var(--suave);
  letter-spacing:.04em;text-transform:uppercase;margin-bottom:14px}
input,textarea,select{font:inherit;color:var(--tinta);background:var(--papel);
  border:1px solid var(--linea);border-radius:9px;padding:10px 12px;width:100%;margin-top:5px;
  transition:border-color .15s,box-shadow .15s}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--acento);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--acento) 18%,transparent)}
textarea{resize:vertical;min-height:80px;line-height:1.5}
.btn{font:inherit;font-weight:700;border-radius:9px;padding:10px 18px;cursor:pointer;
  border:1px solid transparent;transition:filter .15s,background .15s}
.btn:hover{filter:brightness(.95)}
.btn.primario{background:var(--acento);color:#fff;width:100%;margin-top:6px}
.btn.fantasma{background:transparent;color:var(--suave);border-color:var(--linea)}
.enlace{background:none;border:0;color:var(--acento);font:inherit;font-size:13px;
  cursor:pointer;padding:10px 0 0;display:block;margin:0 auto}
.pie-entrada{color:var(--suave);font-size:12.5px;text-align:center;margin:22px 0 0}
.aviso-error{background:var(--foco-fondo);color:var(--foco);border-radius:8px;
  padding:9px 12px;font-size:13px;margin:12px 0 0}

/* barra */
.barra{display:flex;align-items:center;gap:16px;padding:12px 16px;background:var(--papel);
  border-bottom:1px solid var(--linea);position:sticky;top:0;z-index:20}
.barra .marca{margin-right:auto}
.yo{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--suave)}
.chip{display:inline-block;padding:3px 10px;border-radius:999px;font-size:11.5px;font-weight:700;
  letter-spacing:.03em;background:var(--bruma);color:var(--acento-tinta);white-space:nowrap}
.chip.ok{background:var(--ok-fondo);color:var(--ok)}
.chip.falta{background:var(--sol-fondo);color:var(--sol-tinta)}
.chip.foco{background:var(--foco-fondo);color:var(--foco)}

/* intro */
.intro{margin-bottom:22px}
.intro h1{font-size:30px;margin-bottom:6px}
.intro p{color:var(--suave);max-width:60ch;margin:0}

/* tarjetas de unidad */
.malla-unidades{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.tarjeta-unidad{background:var(--papel);border:1px solid var(--linea);border-radius:var(--radio);
  box-shadow:var(--sombra);padding:20px;display:flex;flex-direction:column;gap:14px;
  cursor:pointer;position:relative;overflow:hidden;
  transition:transform .15s,box-shadow .15s,border-color .15s}
.tarjeta-unidad:hover{transform:translateY(-2px);box-shadow:var(--sombra-alta);border-color:var(--u-color)}
.tarjeta-unidad::before{content:'';position:absolute;inset:0 0 auto 0;height:4px;background:var(--u-color)}
/* altura fija en px: con porcentajes, los logos verticales se salían de la franja */
.tu-logo{margin:-20px -20px 0;height:120px;background:#fff;border-bottom:1px solid var(--linea);
  display:flex;align-items:center;justify-content:center;padding:0 24px;overflow:hidden}
.tu-logo img{max-width:100%;max-height:92px;width:auto;height:auto;display:block}
.tu-alto{display:flex;align-items:flex-start;gap:14px}
.tu-serie{width:38px;height:38px;border-radius:10px;flex:none;display:grid;place-items:center;
  font-weight:900;font-size:17px;color:#fff;background:var(--u-color)}
.tu-nombre{font-size:18px;font-weight:900;line-height:1.2}
.tu-que{color:var(--suave);font-size:13px;margin-top:2px}
.tu-intra{font-size:12.5px;color:var(--suave);display:flex;align-items:center;gap:6px}
.tu-intra b{color:var(--tinta)}
.anillo{margin-left:auto;flex:none;width:52px;height:52px;position:relative}
.anillo svg{transform:rotate(-90deg)}
.anillo .pista{stroke:var(--linea)}
.anillo .arco{stroke:var(--u-color);transition:stroke-dasharray .5s ease}
.anillo span{position:absolute;inset:0;display:grid;place-items:center;font-size:13px;font-weight:900}
.tu-pie{display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  border-top:1px solid var(--linea);padding-top:12px;font-size:12.5px;color:var(--suave)}
.tu-nota{font-size:12px;color:var(--sol-tinta);background:var(--sol-fondo);
  padding:6px 9px;border-radius:7px}

/* pendientes globales */
.resumen-global{margin-top:36px;background:var(--papel);border:1px solid var(--linea);
  border-radius:var(--radio);padding:20px;box-shadow:var(--sombra)}
.resumen-global h2{font-size:17px}
.lista-pendientes{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.lista-pendientes li{display:flex;align-items:center;gap:10px;padding:10px 12px;
  background:var(--fondo);border-radius:9px;font-size:13.5px;cursor:pointer}
.lista-pendientes li:hover{background:var(--bruma)}
.lista-pendientes .pinta{width:8px;height:28px;border-radius:4px;flex:none}
.lista-pendientes .quien{margin-left:auto}

/* unidad */
.volver{display:inline-block;font-size:13.5px;margin-bottom:14px;color:var(--suave)}
.volver:hover{color:var(--acento)}
.cabeza-unidad{display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  background:var(--papel);border:1px solid var(--linea);border-left:5px solid var(--u-color);
  border-radius:var(--radio);padding:20px;box-shadow:var(--sombra);margin-bottom:18px}
.cu-txt h1{font-size:24px}
.cu-txt p{margin:3px 0 0;color:var(--suave);font-size:13.5px}
.cu-datos{margin-left:auto;display:flex;gap:22px;text-align:right;flex-wrap:wrap}
.cu-dato b{display:block;font-size:21px;font-weight:900;line-height:1.1}
.cu-dato span{font-size:11.5px;color:var(--suave);text-transform:uppercase;letter-spacing:.05em}

.filtros{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.pildora{font:inherit;font-size:13px;font-weight:700;background:var(--papel);color:var(--suave);
  border:1px solid var(--linea);border-radius:999px;padding:7px 15px;cursor:pointer}
.pildora.activa{background:var(--acento);color:#fff;border-color:var(--acento)}

.secciones{display:grid;gap:16px}
.seccion{background:var(--papel);border:1px solid var(--linea);border-radius:var(--radio);
  box-shadow:var(--sombra);overflow:hidden}
.seccion > summary{list-style:none;cursor:pointer;padding:16px 20px;display:flex;
  align-items:center;gap:12px;border-bottom:1px solid transparent}
.seccion[open] > summary{border-bottom-color:var(--linea)}
.seccion > summary::-webkit-details-marker{display:none}
.seccion summary h3{font-size:16px}
.seccion summary .flecha{margin-left:auto;color:var(--suave);transition:transform .2s;font-size:13px}
.seccion[open] summary .flecha{transform:rotate(90deg)}
.s-intro{color:var(--suave);font-size:13px;padding:14px 20px 0;margin:0}
.campos{padding:8px 20px 20px;display:grid;gap:4px}
.campo{padding:14px 0;border-bottom:1px solid var(--linea);display:grid;
  grid-template-columns:1fr;gap:7px}
.campo:last-child{border-bottom:0}
.campo.oculto{display:none}
.c-alto{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.c-etiqueta{font-weight:700;font-size:14px}
.c-ayuda{color:var(--suave);font-size:12.5px;margin:0}
.c-quien{margin-left:auto}
.c-valor input,.c-valor textarea,.c-valor select{margin-top:0}
.c-valor.listo input,.c-valor.listo textarea,.c-valor.listo select{
  border-left:3px solid var(--ok)}
.c-meta{font-size:11.5px;color:var(--suave);min-height:15px}
.c-acciones{display:flex;gap:8px;align-items:center}
.na{font-size:12px;color:var(--suave);display:flex;align-items:center;gap:5px;cursor:pointer;white-space:nowrap}
.na input{width:auto;margin:0}
.campo.es-na .c-valor{opacity:.45}

.pie{max-width:1180px;margin:0 auto;padding:18px 16px 30px;display:flex;gap:14px;
  color:var(--suave);font-size:12.5px;border-top:1px solid var(--linea)}
.estado-guardado{margin-left:auto}
.estado-guardado.ok{color:var(--ok)}

.cargando{position:fixed;inset:0;display:grid;place-items:center;background:var(--fondo);
  color:var(--suave);z-index:50}
.cargando[hidden]{display:none}

@media (max-width:900px){
  .ent-cuerpo{grid-template-columns:1fr;gap:32px;padding:28px 0}
  .caja-entrada{max-width:440px}
}
@media (max-width:640px){
  .ent-logo{height:44px}
  .ent-razon{border-left:0;padding-left:0;flex-basis:100%}
  .ent-historia h1{font-size:28px}
  .ent-historia>p{font-size:15px}
  .ent-series{grid-template-columns:repeat(2,minmax(0,1fr))}
  .marca-logo{height:24px}
  .marca-sub{display:none}
  .env{padding:18px 16px 40px}
  .intro h1{font-size:24px}
  .cu-datos{margin-left:0;text-align:left}
  .barra{padding:10px 14px}
  .yo #yo-nombre{display:none}
}

.sin-acceso{grid-column:1/-1;background:var(--papel);border:1px solid var(--linea);
  border-radius:var(--radio);padding:30px;text-align:center;box-shadow:var(--sombra)}
.sin-acceso h2{font-size:18px;margin-bottom:8px}
.sin-acceso p{color:var(--suave);margin:0;max-width:52ch;margin-inline:auto}
.aviso-vitrina{background:var(--sol-fondo);color:var(--sol-tinta);border-radius:9px;
  padding:11px 13px;font-size:12.5px;line-height:1.45;margin:0 0 18px}

/* tablero financiero */
.tablero{background:var(--papel);border:1px solid var(--linea);border-radius:var(--radio);
  padding:20px;box-shadow:var(--sombra);margin-bottom:18px}
.tablero[hidden]{display:none}
.t-alto{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.t-alto h2{font-size:17px}
.t-cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:14px;
  padding-bottom:18px;border-bottom:1px solid var(--linea)}
.cifra b{display:block;font-size:22px;font-weight:900;line-height:1.15}
.cifra span{font-size:11.5px;color:var(--suave);text-transform:uppercase;letter-spacing:.05em}
.cifra.bien b{color:var(--ok)} .cifra.mal b{color:var(--foco)}
.grafica{margin-top:26px}
.plano{position:relative;height:160px;display:flex;gap:18px;align-items:flex-end;
  border-bottom:1px solid var(--linea)}
.par{flex:1;height:100%;display:flex;gap:5px;align-items:flex-end;justify-content:center;
  position:relative;z-index:1}
.col{width:26px;border-radius:5px 5px 0 0;min-height:3px;transition:height .4s ease}
.col.ing{background:var(--u-color,var(--acento))}
.col.gas{background:var(--bruma);border:1px solid var(--linea);border-bottom:0}
.pies{display:flex;gap:18px;margin-top:8px}
.pie{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px}
.pie .etq{font-size:11.5px;color:var(--suave);text-transform:uppercase;letter-spacing:.04em}
.pie .res{font-size:12.5px;font-weight:700}
.pie .res.bien{color:var(--ok)} .pie .res.mal{color:var(--foco)}
.linea{position:absolute;left:0;right:0;border-top:1px dashed var(--suave);
  pointer-events:none;z-index:3}
.linea span{position:absolute;right:0;top:-8px;font-size:10.5px;background:var(--papel);
  padding:0 5px;color:var(--suave);font-weight:700;white-space:nowrap}
.linea.meta{border-top-color:var(--ok)} .linea.meta span{color:var(--ok)}
.linea.equilibrio{border-top-color:var(--sol-tinta)} .linea.equilibrio span{color:var(--sol-tinta)}
.leyenda{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--suave);margin-top:14px}
.leyenda .p{width:11px;height:11px;border-radius:3px;display:inline-block}
.leyenda .p.ing{background:var(--u-color,var(--acento))} .leyenda .p.gas{background:var(--linea);border:1px solid var(--suave)}
.categorias{margin-top:22px;padding-top:18px;border-top:1px solid var(--linea)}
.categorias h3{font-size:13px;text-transform:uppercase;letter-spacing:.07em;color:var(--suave);
  margin-bottom:12px}
.cat{display:grid;grid-template-columns:130px 1fr 90px;gap:10px;align-items:center;
  padding:5px 0;font-size:13px}
.cat .cb{background:var(--fondo);border-radius:4px;height:9px;overflow:hidden}
.cat .cb i{display:block;height:100%;background:var(--u-color,var(--acento));border-radius:4px}
.cat .cv{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
@media (max-width:560px){
  .cat{grid-template-columns:100px 1fr 76px;font-size:12px}
  .col{width:18px} .plano,.pies{gap:10px}
}

/* plan de venta por artículo */
.plan-cats{display:grid;gap:10px;margin-top:20px}
.cat-plan{border:1px solid var(--linea);border-radius:10px;overflow:hidden}
.cat-plan > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;
  padding:12px 14px;background:var(--fondo);flex-wrap:wrap}
.cat-plan > summary::-webkit-details-marker{display:none}
.cp-nombre{font-weight:700;font-size:14px;min-width:120px}
.cp-barra{flex:1;min-width:70px;height:9px;background:var(--papel);border-radius:4px;overflow:hidden}
.cp-barra i{display:block;height:100%;background:var(--u-color,var(--acento));border-radius:4px}
.cp-pct{font-size:12px;color:var(--suave);font-weight:700;width:36px;text-align:right}
.cp-total{font-weight:900;font-variant-numeric:tabular-nums;min-width:74px;text-align:right}
.t-plan{width:100%;border-collapse:collapse;font-size:13.5px}
.t-plan th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;
  color:var(--suave);padding:9px 14px;border-bottom:1px solid var(--linea);font-weight:700}
.t-plan th:not(:first-child){text-align:right}
.t-plan td{padding:9px 14px;border-bottom:1px solid var(--linea)}
.t-plan tr:last-child td{border-bottom:0}
.t-plan .num{text-align:right;font-variant-numeric:tabular-nums}
.t-plan .fuerte{font-weight:700}
.t-plan .uds{color:var(--u-color,var(--acento));font-weight:900}
@media (max-width:560px){
  .cp-nombre{min-width:0;flex:1} .cp-barra{display:none}
  .t-plan th,.t-plan td{padding:8px 10px;font-size:12.5px}
}

/* ---------- micrositio de unidad ---------- */
.micrositio{display:grid;gap:18px;margin-bottom:18px}
.micrositio[hidden]{display:none}
.tarjeta{background:var(--papel);border:1px solid var(--linea);border-radius:var(--radio);
  padding:20px;box-shadow:var(--sombra)}
.tarjeta h2{font-size:17px}
.sub{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--suave);
  margin:22px 0 12px}
.pie-nota{font-size:12.5px;color:var(--suave);margin:16px 0 0;line-height:1.55}
.pie-nota b{color:var(--tinta)}
.regla{font-size:13.5px;color:var(--suave);margin:0 0 18px;line-height:1.55;
  background:var(--fondo);padding:12px 14px;border-radius:9px;border-left:3px solid var(--u-color,var(--acento))}
.regla b{color:var(--tinta)}
.nota-vacia{font-size:12.5px;color:var(--suave);margin:16px 0 0;padding:12px 14px;
  background:var(--fondo);border-radius:9px;line-height:1.55}

/* el mes en curso */
.mes-actual{border-left:5px solid var(--u-color,var(--acento))}
.carril{margin:18px 0 20px}
.carril-pista{position:relative;height:16px;background:var(--fondo);border-radius:8px;
  border:1px solid var(--linea)}
.carril-avance{height:100%;background:var(--u-color,var(--acento));border-radius:8px;
  transition:width .5s ease;min-width:2px}
.carril-hoy{position:absolute;top:-5px;bottom:-5px;width:2px;background:var(--foco)}
.carril-hoy span{position:absolute;top:-17px;left:50%;transform:translateX(-50%);
  font-size:10px;font-weight:700;color:var(--foco);text-transform:uppercase;letter-spacing:.06em}
.carril-pies{display:flex;justify-content:space-between;font-size:12.5px;
  color:var(--suave);margin-top:9px}
.cifra.ancha{grid-column:span 2}
.cifra b.chica{font-size:14px;font-weight:700;line-height:1.35}

/* estado de resultados */
.t-pyg{width:100%;border-collapse:collapse;font-size:14.5px;margin-top:6px}
.t-pyg td{padding:10px 0;border-bottom:1px solid var(--linea)}
.t-pyg .num{text-align:right;font-variant-numeric:tabular-nums;font-weight:700}
.t-pyg .sutil{font-weight:400;font-size:12.5px;width:70px}
.t-pyg .total td{border-bottom:0;border-top:2px solid var(--linea);font-weight:900;
  font-size:16px;padding-top:12px}
.t-pyg .total.bien td{color:var(--ok)} .t-pyg .total.mal td{color:var(--foco)}

/* gasto contra ingreso */
.pares{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.par-mes{border:1px solid var(--linea);border-radius:10px;padding:14px;background:var(--fondo)}
.par-mes.bien{border-left:4px solid var(--ok)}
.par-mes.medio{border-left:4px solid var(--sol)}
.par-mes.mal{border-left:4px solid var(--foco)}
.pm-alto{font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--suave);
  font-weight:700;margin-bottom:9px}
.pm-cifras{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--suave)}
.pm-cifras b{display:block;color:var(--tinta);font-size:15px;font-weight:900}
.pm-veredicto{font-size:12.5px;margin-top:10px;line-height:1.5;color:var(--suave)}
.pm-veredicto b{color:var(--tinta)}
.par-mes.mal .pm-veredicto b{color:var(--foco)}
.par-mes.bien .pm-veredicto b{color:var(--ok)}

/* la rampa */
.rampa{display:flex;gap:10px;align-items:flex-end;overflow-x:auto;padding-bottom:4px}
.paso{flex:1;min-width:92px;text-align:center}
.paso-barra{height:130px;display:flex;flex-direction:column-reverse;justify-content:flex-start;
  border-radius:6px 6px 0 0;overflow:hidden;background:var(--fondo)}
.pb-piso{background:var(--bruma);border:1px solid var(--linea);border-bottom:0}
.pb-util{background:var(--u-color,var(--acento))}
.paso-mes{font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--suave);
  margin-top:8px;font-weight:700}
.paso-meta{font-weight:900;font-size:14px;font-variant-numeric:tabular-nums}
.paso-alza{font-size:11.5px;color:var(--suave)}
.paso-util{font-size:12px;font-weight:700;color:var(--suave);margin-top:3px}
.paso-util.bien{color:var(--ok)}
.paso-nota{font-size:10.5px;color:var(--suave);margin-top:5px;line-height:1.35}

/* la semana */
.semana{display:grid;gap:9px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.dia{border:1px solid var(--linea);border-radius:10px;padding:13px;background:var(--fondo)}
.dia.fiesta{border-top:4px solid var(--sol)}
.dia.clase{border-top:4px solid var(--acento)}
.dia.acceso{border-top:4px solid var(--ok)}
.dia-nombre{font-weight:900;font-size:14px}
.dia-horario{font-size:11.5px;color:var(--suave);margin-top:1px}
.dia-uso{font-size:12.5px;font-weight:700;margin-top:9px}
.dia.fiesta .dia-uso{color:var(--sol-tinta)}
.dia.clase .dia-uso{color:var(--acento-tinta)}
.dia.acceso .dia-uso{color:var(--ok)}
.dia-detalle{font-size:11.5px;color:var(--suave);margin-top:6px;line-height:1.45}

/* El año, mes a mes */
.anio-tabs{margin-left:auto;display:inline-flex;gap:4px;background:var(--fondo);padding:3px;border-radius:999px}
.anio-tab,.art-tab{border:0;background:transparent;color:var(--suave);font:inherit;font-size:12.5px;font-weight:700;
  padding:4px 12px;border-radius:999px;cursor:pointer}
.anio-tab.activo,.art-tab.activo{background:var(--u-color,var(--acento));color:#fff}
.escalas{margin:4px 0 14px}
.t-anio-caja{overflow-x:auto;margin:0 -4px}
.t-anio{width:100%;border-collapse:collapse;font-size:13.5px;min-width:0}
.t-anio th{font-size:11px;color:var(--suave);text-transform:uppercase;letter-spacing:.05em;font-weight:700;
  text-align:left;padding:6px 6px;border-bottom:2px solid var(--linea)}
.t-anio td{padding:8px 6px;border-bottom:1px solid var(--linea)}
.t-anio .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.t-anio td.num{font-weight:700}
.t-anio td.num.sutil{font-weight:400;font-size:12.5px}
.t-anio td.mal{color:var(--foco)}
.t-anio tr.vacio td{color:var(--suave);font-weight:400}
.t-anio tr.hoy td{background:var(--fondo)}
.t-anio tr.hoy td:first-child{box-shadow:inset 3px 0 0 var(--u-color,var(--acento))}
.t-anio tfoot td{border-bottom:0;border-top:2px solid var(--linea);font-weight:900;padding-top:10px}
@media (max-width:560px){
  .t-anio .col-util,.t-anio .col-estado{display:none}
  .t-anio{font-size:12.5px}
  .t-anio th,.t-anio td{padding:7px 4px}
}

/* El mes por artículo y la zanahoria */
.zanahoria{background:var(--fondo);border-radius:var(--radio);padding:14px 16px;margin:4px 0 16px;
  border:1px dashed var(--linea)}
.zanahoria.abierta{border:1px solid var(--ok);background:var(--ok-fondo)}
.z-candado{margin-bottom:14px}
.z-alto{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:14px;margin-bottom:8px}
.z-alto span{color:var(--suave);font-variant-numeric:tabular-nums}
.z-pie{font-size:12.5px;color:var(--suave);margin-top:6px}
.z-pie b{color:var(--tinta)}
.t-art{width:100%;border-collapse:collapse;font-size:13.5px}
.t-art th{font-size:11px;color:var(--suave);text-transform:uppercase;letter-spacing:.05em;font-weight:700;
  text-align:left;padding:6px;border-bottom:2px solid var(--linea)}
.t-art td{padding:8px 6px;border-bottom:1px solid var(--linea);vertical-align:top}
.t-art .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.t-art td.num{font-weight:700}
.t-art td.num.sutil{font-weight:400;font-size:12.5px}
.t-art .zana{color:var(--u-color,var(--acento))}
.t-art tr.art-cat td{font-weight:900;font-size:12.5px;text-transform:uppercase;letter-spacing:.04em;
  padding-top:14px;border-bottom:1px solid var(--linea)}
.t-art tr.art-cat .sutil{text-transform:none;letter-spacing:0;font-weight:400}
.art-barra{height:4px;background:var(--linea);border-radius:3px;margin-top:5px;max-width:180px}
.art-barra i{display:block;height:100%;background:var(--u-color,var(--acento));border-radius:3px}
@media (max-width:560px){
  .t-art .col-precio{display:none}
  .t-art{font-size:12.5px}
  .t-art th,.t-art td{padding:7px 4px}
}
.llaves{display:grid;gap:6px;margin-top:10px}
.llave{display:flex;gap:8px;align-items:baseline;font-size:13px;color:var(--suave)}
.llave span{flex:0 0 18px;height:18px;border-radius:50%;display:inline-grid;place-items:center;font-size:11px;
  font-weight:900;background:var(--foco-fondo);color:var(--foco)}
.llave.ok span{background:var(--ok-fondo);color:var(--ok)}
.llave.pend span{background:var(--sol-fondo);color:var(--sol-tinta)}
.llave b{color:var(--tinta)}

/* Tu meta del mes: lo primero que se ve */
.meta-hero{border:2px solid var(--u-color,var(--acento));background:
  linear-gradient(135deg,color-mix(in srgb,var(--u-color,var(--acento)) 10%,var(--papel)),var(--papel) 60%)}
.mh-mes{font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:var(--u-color,var(--acento))}
.mh-par{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:10px 0 6px}
.mh-bloque span{display:block;font-size:13px;color:var(--suave);font-weight:700}
.mh-bloque b{display:block;font-size:40px;font-weight:900;line-height:1.05;font-variant-numeric:tabular-nums}
.mh-bloque.gana b{color:var(--ok)}
.mh-flecha{font-size:28px;color:var(--suave);font-weight:300}
.mh-nota{font-size:12.5px;color:var(--suave);margin:4px 0 0;max-width:560px}
.mh-escalera{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}
.mh-escalon{background:var(--fondo);border-radius:10px;padding:10px 12px}
.mh-escalon.base{outline:2px solid var(--u-color,var(--acento))}
.mh-escalon span{display:block;font-size:11px;color:var(--suave);text-transform:uppercase;letter-spacing:.05em}
.mh-escalon b{display:block;font-size:17px;font-variant-numeric:tabular-nums}
.mh-escalon em{font-style:normal;font-size:13px;font-weight:700;color:var(--ok)}
.mh-top{display:grid;gap:4px;font-size:13.5px}
.mh-top span{font-size:11px;color:var(--suave);text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px}
.mh-top b{color:var(--u-color,var(--acento));display:inline-block;min-width:58px}
.mh-pie{font-size:12px;color:var(--suave);margin:14px 0 0}
@media (max-width:560px){
  .mh-bloque b{font-size:30px}
  .mh-par{gap:10px}
  .mh-escalera{grid-template-columns:1fr;gap:6px}
  .mh-escalon{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
}

/* Caja de comisión: solo la ve el dueño */
.caja-comision{background:var(--papel);border:1px dashed var(--u-color,var(--acento));border-radius:var(--radio);
  padding:14px 18px;margin:0 0 18px}
.cc-alto{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.cc-alto b{font-size:15px}
.cc-campos{display:flex;gap:18px;align-items:flex-end;flex-wrap:wrap;margin:12px 0 8px}
.cc-campos label{display:grid;gap:4px;font-size:12px;color:var(--suave)}
.cc-campos label > span:first-child{font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:11px}
.cc-in{display:inline-flex;align-items:center;gap:6px}
.cc-in input{width:90px;font-size:20px;font-weight:900;padding:6px 10px;text-align:right}
.cc-in i{font-style:normal;font-size:18px;font-weight:900;color:var(--tinta)}
.cc-campos small{font-size:11.5px}
.cc-btn{background:var(--u-color,var(--acento));color:#fff;border-color:transparent}
.cc-pie{font-size:12px}

/* Sueldo del intrapreneur: meta, regla y su mes */
.mh-regla{font-size:13.5px;margin:6px 0 0;max-width:620px}
.mh-sueldo{background:var(--fondo);border-radius:10px;padding:10px 14px;font-size:15px}
.mh-sueldo span{display:block;font-size:11px;color:var(--suave);text-transform:uppercase;letter-spacing:.05em;margin-bottom:3px}
.mh-sueldo i{font-style:normal;color:var(--suave);margin:0 6px}
.mh-sueldo b.v{color:var(--ok)} .mh-sueldo b.t{font-size:19px}
.cc-calc{margin:6px 0 8px}
.cc-tabla{width:100%;border-collapse:collapse;font-size:13px}
.cc-tabla th{font-size:10.5px;color:var(--suave);text-transform:uppercase;letter-spacing:.05em;text-align:left;
  padding:5px 6px;border-bottom:1px solid var(--linea)}
.cc-tabla td{padding:6px;border-bottom:1px solid var(--linea)}
.cc-tabla .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.cc-tabla .v{color:var(--ok);font-weight:700} .cc-tabla .mal{color:var(--foco);font-weight:700}
.cc-ojo{font-size:12.5px;background:var(--foco-fondo);color:var(--tinta);border-radius:8px;padding:8px 12px;margin:10px 0 0}
.cc-nota{font-size:11.5px;margin:6px 0 0}
.t-sueldos tbody tr{cursor:pointer}
.t-sueldos .pinta{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px}

/* Tu mix: qué vender. Cinco tonos por categoría, legibles en claro y oscuro */
.mix,.temporada{--t1:#D98E04;--t2:#1F9E89;--t3:#3A7BD5;--t4:#C4506A;--t5:#8A6FBF;--t6:#5E8C31;--t7:#8C8C8C}
.mix-barra{display:flex;height:14px;border-radius:7px;overflow:hidden;gap:2px;margin:6px 0 8px}
.mix-barra i{display:block;height:100%}
.t1{--tono:var(--t1)} .t2{--tono:var(--t2)} .t3{--tono:var(--t3)} .t4{--tono:var(--t4)} .t5{--tono:var(--t5)} .t6{--tono:var(--t6)} .t7{--tono:var(--t7)}
.mix-barra i,.mix-leyenda i{background:var(--tono)}
.mix-leyenda{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--suave)}
.mix-leyenda i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px}
.mix-estrellas{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 16px;align-items:center}
.me-t{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.05em;color:#D98E04;width:100%}
.me-p{background:color-mix(in srgb,#F2B705 16%,var(--papel));border:1px solid color-mix(in srgb,#F2B705 45%,var(--linea));
  border-radius:999px;padding:4px 11px;font-size:12.5px}
.mix-malla{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px}
.mix-cat{border:1px solid var(--linea);border-top:4px solid var(--tono);border-radius:12px;padding:12px 14px;background:var(--papel)}
.mix-cat header{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.mix-cat h3{font-size:16px;margin:0}
.mc-meta{text-align:right}
.mc-meta b{display:block;font-size:18px;color:var(--tono);font-variant-numeric:tabular-nums}
.mc-meta span{font-size:11px;color:var(--suave)}
.mc-trim{font-size:12px;color:var(--suave);margin:4px 0 10px;line-height:1.45}
.mc-trim b{color:var(--tinta)}
.mc-prods{display:grid;gap:9px}
.mp{padding:7px 9px;border-radius:9px;background:var(--fondo)}
.mp.estrella{background:color-mix(in srgb,#F2B705 13%,var(--fondo));outline:1px solid color-mix(in srgb,#F2B705 40%,transparent)}
.mp-alto{display:flex;justify-content:space-between;gap:8px;font-size:13.5px;font-weight:700}
.mp-nombre em{font-style:normal;color:#D98E04;margin-right:4px}
.mp-uds{color:var(--tono);font-weight:900;white-space:nowrap}
.mp-barra{height:5px;border-radius:3px;background:var(--linea);margin:5px 0 4px}
.mp-barra i{display:block;height:100%;border-radius:3px;background:var(--tono)}
.mp-pie{display:flex;flex-wrap:wrap;gap:2px 12px;font-size:11.5px;color:var(--suave)}
.mp-pie b{color:var(--tinta)}
.mp-te{color:var(--ok);font-weight:700}

/* La temporada: trimestre real y cierre del año */
.tp-graf{display:flex;align-items:flex-end;gap:10px;height:230px;margin:10px 0 8px;padding-top:18px}
.tp-col{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;justify-content:flex-end;min-width:0}
.tp-pila{width:100%;max-width:64px;display:flex;flex-direction:column-reverse;border-radius:6px 6px 0 0;overflow:hidden}
.tp-pila i{display:block;width:100%;background:var(--tono)}
.tp-col.real .tp-pila{opacity:.55}
.tp-col.hoy .tp-pila{outline:2px solid var(--tinta);outline-offset:2px}
.tp-alza{font-size:11px;font-weight:700;color:var(--ok);height:16px}
.tp-total{font-size:12.5px;font-weight:900;margin-top:5px;font-variant-numeric:tabular-nums}
.tp-mes{font-size:12px;font-weight:700}
.tp-temp{font-size:10.5px;color:var(--suave);text-align:center;line-height:1.2;min-height:26px}
.temporada .mix-leyenda i{background:var(--tono)}
.tp-p{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:6px;background:var(--tono)}
.tp-tabla th.r,.tp-tabla td.r{color:var(--suave)}
.tp-tabla td.arriba,.pie-nota .arriba{color:#D9730D;font-weight:900}
.tp-notas{display:grid;gap:5px;font-size:12.5px;margin:12px 0 0;color:var(--suave)}
.tp-notas b{color:var(--tinta)}
@media (max-width:560px){
  .tp-graf{gap:4px;height:190px}
  .tp-total{font-size:10.5px} .tp-temp{display:none}
}

/* Accesos: solo el dueño */
.ac-cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:14px;
  background:var(--papel);border:1px solid var(--linea);border-radius:var(--radio);
  padding:16px 20px;box-shadow:var(--sombra)}
.ac-alta{margin-top:18px}
.ac-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:14px}
.ac-form > label{display:grid;gap:5px;font-size:12px;font-weight:700;color:var(--suave);
  text-transform:uppercase;letter-spacing:.05em}
.ac-form > label input,.ac-form > label select{text-transform:none;letter-spacing:0;font-weight:400}
.ac-series{grid-column:1/-1;border:1px solid var(--linea);border-radius:9px;padding:10px 14px 12px;
  display:flex;flex-wrap:wrap;gap:8px 18px;margin:0}
.ac-series[hidden]{display:none}
.ac-series legend{font-size:12px;font-weight:700;color:var(--suave);text-transform:uppercase;
  letter-spacing:.05em;padding:0 6px}
.ac-serie{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;cursor:pointer}
.ac-serie input{width:auto;margin:0;accent-color:var(--u-color)}
.ac-serie span{border-left:3px solid var(--u-color);padding-left:7px}
.ac-botones{grid-column:1/-1;display:flex;gap:10px;flex-wrap:wrap}
.ac-btn{background:var(--acento);color:#fff}
.ac-btn:disabled{opacity:.6;cursor:wait}
.ac-tabla td{vertical-align:top}
.ac-dato{display:block;font-size:11.5px;color:var(--suave);margin-top:3px;word-break:break-all}
.ac-chip{background:var(--bruma);box-shadow:inset 3px 0 0 var(--u-color);margin:0 4px 4px 0}
.ac-acciones{white-space:nowrap;text-align:right}
.btn.chico{padding:5px 10px;font-size:12px;border-radius:7px}
.btn.peligro{color:var(--foco);border-color:var(--foco-fondo)}
.ac-suspendido td{opacity:.6}
.ac-suspendido td:last-child{opacity:1}
a.btn{text-decoration:none;display:inline-block}
a.btn[hidden],.btn[hidden]{display:none}
@media (max-width:640px){
  .ac-col-alta{display:none}
  .ac-acciones{white-space:normal}
  .ac-acciones .btn{margin:0 0 4px}
}
