/* 7. Estructura. Idea: cada pantalla abre con una pieza hecha a medida de lo que mide (paneles con semáforo,
   matriz de riesgos, lista de comprobación con anillo, tarjetas de persona, tablero de marca) y el resto queda debajo.
   Las piezas son un resumen de lo escrito: en modo Rellenar se ocultan para no enseñar cifras viejas. */

.modo-ed .c:has(> .p7-ver){display:none}
.p7-ver{display:flex;flex-direction:column;gap:20px;min-width:0}
.p7-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Estados: color + forma + palabra */
.p7-ok{--p7-c:#1B7A33;--p7-f:#E9F6EC}
.p7-warn{--p7-c:#9A4F00;--p7-f:#FFF3E0}
.p7-bad{--p7-c:#C4001A;--p7-f:#FDECEE}
.p7-none{--p7-c:#6E6E73;--p7-f:#F0F0F2}
.p7-gl{display:inline-flex;align-items:center;justify-content:center;flex:none;width:36px;height:36px;border-radius:50%;background:var(--p7-f);color:var(--p7-c)}
.p7-gl svg{display:block}
.p7-tag{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;background:var(--p7-f);color:var(--p7-c);font-size:12px;line-height:16px;font-weight:600;white-space:nowrap}
.p7-tag svg{flex:none}

/* Cabecera de pieza */
.p7-cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 28px}
.p7-cifra{margin:0;font-size:56px;line-height:60px;font-weight:700;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.p7-cifra small{font-size:20px;line-height:28px;font-weight:600;letter-spacing:-.02em;color:#6E6E73;margin-left:6px}
.p7-tit{margin:0;font-size:28px;line-height:34px;font-weight:700;letter-spacing:-.03em}
.p7-apoyo{margin:4px 0 0;font-size:13px;line-height:18px;color:#6E6E73}
.p7-leyenda{display:flex;flex-wrap:wrap;gap:8px 16px;margin:0;padding:0;list-style:none;font-size:13px;line-height:18px}
.p7-leyenda li{display:inline-flex;align-items:center;gap:6px}
.p7-leyenda .p7-gl{width:24px;height:24px}

/* Barra de reparto y barras de avance */
.p7-reparto{display:flex;gap:3px;height:14px;border-radius:99px;overflow:hidden}
.p7-reparto i{display:block;min-width:6px;background:var(--p7-c);transition:flex-grow .3s ease-out}
.p7-bar{height:8px;border-radius:99px;background:#E8E8ED;overflow:hidden}
.p7-bar i{display:block;height:100%;border-radius:99px;background:#7A1230;transform-origin:left;animation:p7-crece .6s cubic-bezier(.2,.8,.2,1)}
@keyframes p7-crece{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* Vacío útil */
.p7-vacio{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:20px;border-radius:14px;background:#F5F5F7}
.p7-vacio p{margin:0;font-size:15px;line-height:22px;color:#424245}

/* 1. Semáforo: cuadrícula de paneles */
.p7-paneles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}
.p7-panel{display:flex;flex-direction:column;gap:8px;min-width:0;padding:16px 16px 18px;border-radius:16px;background:var(--p7-f);border-top:6px solid var(--p7-c);transition:transform .2s ease-out}
.p7-panel .p7-gl{background:#fff}
.p7-panel:hover{transform:translateY(-2px)}
.p7-panel-e{display:flex;align-items:center;gap:10px}
.p7-panel-e b{font-size:20px;line-height:24px;font-weight:700;letter-spacing:-.02em;color:var(--p7-c)}
.p7-panel h3{margin:0;font-size:16px;line-height:22px;font-weight:600;color:#1D1D1F}
.p7-panel p{margin:0;font-size:14px;line-height:20px;color:#424245}
.p7-panel .p7-vacio-n{color:#6E6E73}

/* 2. Riesgos: matriz y lista */
.p7-riesgos{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:28px;align-items:start}
.p7-matriz{display:grid;grid-template-columns:auto auto repeat(5,minmax(0,1fr));grid-template-rows:repeat(5,minmax(46px,1fr)) auto auto;gap:4px;min-width:0}
.p7-eje{display:flex;align-items:center;justify-content:center;font-size:12px;line-height:16px;color:#6E6E73;font-weight:600}
.p7-eje-y{grid-row:1/6;grid-column:1;writing-mode:vertical-rl;transform:rotate(180deg)}
.p7-eje-x{grid-column:3/8;padding-top:4px}
.p7-num{display:flex;align-items:center;justify-content:center;font-size:12px;color:#6E6E73}
.p7-celda{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;align-content:center;gap:3px;min-width:0;border-radius:10px;background:var(--p7-f);color:#424245;font-size:11px;line-height:14px}
.p7-pto{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:#7A1230;color:#fff;font-size:13px;font-weight:700;box-shadow:0 0 0 2px #fff}
.p7-lista{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;list-style:none}
.p7-lista li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;align-items:start;padding:12px 14px;border-radius:14px;background:#F5F5F7}
.p7-lista .p7-pto{box-shadow:none;margin-top:2px}
.p7-lista b{font-size:15px;line-height:22px;font-weight:600}
.p7-lista span.p7-meta{grid-column:2;display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;font-size:13px;line-height:18px;color:#6E6E73}
.p7-niv{display:inline-flex;gap:6px;align-items:center}

/* 3. Legal: lista de comprobación con anillo */
.p7-legal{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:28px;align-items:start}
.p7-anillo{position:relative;width:180px;height:180px;margin:0 auto}
.p7-anillo svg{display:block;transform:rotate(-90deg)}
.p7-anillo circle{fill:none;stroke-width:14}
.p7-anillo .p7-pista{stroke:#E8E8ED}
.p7-anillo .p7-arco{stroke:#7A1230;stroke-linecap:round;transition:stroke-dasharray .4s ease-out}
.p7-anillo div{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.p7-anillo b{font-size:56px;line-height:56px;font-weight:700;letter-spacing:-.04em}
.p7-anillo span{font-size:13px;line-height:18px;color:#6E6E73}
.p7-check{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}
.p7-check li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:2px 14px;align-items:start;padding:14px 0;border-bottom:1px solid rgba(0,0,0,.06);min-height:44px}
.p7-check li:last-child{border-bottom:0}
.p7-check h3{margin:0;font-size:16px;line-height:22px;font-weight:600}
.p7-check p{margin:2px 0 0;font-size:14px;line-height:20px;color:#424245}
.p7-check .p7-falta{color:#9A4F00;font-weight:500}
.p7-check .p7-pie{display:flex;flex-wrap:wrap;gap:2px 12px;margin-top:4px;font-size:12px;line-height:16px;color:#6E6E73}
.p7-check .p7-hecho h3{font-weight:500}

/* 4. Fiscal: calendario */
.p7-prox{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;padding:20px;border-radius:16px;background:linear-gradient(155deg,#8E1A3A 0%,#5C0F26 100%);color:#fff}
.p7-prox .p7-cifra small{color:rgba(255,255,255,.84)}
.p7-prox p{margin:0}
.p7-prox .p7-apoyo{color:rgba(255,255,255,.84)}
.p7-cal{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none}
.p7-cal li{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:14px;align-items:center;padding:10px 14px 10px 10px;border-radius:14px;background:#F5F5F7;min-height:44px}
.p7-dia{display:flex;flex-direction:column;align-items:center;justify-content:center;height:52px;border-radius:12px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.p7-dia b{font-size:20px;line-height:22px;font-weight:700;letter-spacing:-.02em}
.p7-dia span{font-size:11px;line-height:14px;font-weight:600;color:#6E6E73;text-transform:uppercase}
.p7-cal h3{margin:0;font-size:15px;line-height:20px;font-weight:600}
.p7-cal p{margin:0;font-size:12px;line-height:16px;color:#6E6E73}
.p7-puntos{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}

/* 5. Bancos: caja y reparto */
.p7-caja{display:flex;flex-direction:column;gap:20px}
.p7-cuentas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:12px;margin:0;padding:0;list-style:none}
.p7-cuentas li{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:14px;background:#F5F5F7;border-left:6px solid var(--p7-c)}
.p7-cuentas b{font-size:22px;line-height:28px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.p7-cuentas span{font-size:13px;line-height:18px;color:#424245}
.p7-cuentas em{font-style:normal;font-size:12px;line-height:16px;color:#6E6E73}
.p7-s0{--p7-c:#7A1230}.p7-s1{--p7-c:#C9798F}.p7-s2{--p7-c:#E3B8C5}.p7-s3{--p7-c:#6E6E73}

/* 6. Equipo: tarjetas por persona */
.p7-gente{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:14px;margin:0;padding:0;list-style:none}
.p7-pers{display:flex;flex-direction:column;gap:10px;min-width:0;padding:18px;border-radius:16px;background:#F5F5F7}
.p7-pers.p7-hueco{background:#fff;border:2px dashed #C9798F}
.p7-av{display:inline-flex;align-items:center;justify-content:center;flex:none;width:48px;height:48px;border-radius:50%;background:#F4E3E8;color:#7A1230;font-size:20px;font-weight:700}
.p7-hueco .p7-av{background:#fff;border:2px dashed #C9798F}
.p7-pers header{display:flex;align-items:center;gap:12px}
.p7-pers h3{margin:0;font-size:18px;line-height:22px;font-weight:700;letter-spacing:-.02em}
.p7-pers header p{margin:0;font-size:13px;line-height:18px;color:#6E6E73}
.p7-pers dl{margin:0;display:flex;flex-direction:column;gap:2px}
.p7-pers dt{font-size:12px;line-height:16px;font-weight:600;color:#6E6E73}
.p7-pers dd{margin:0 0 6px;font-size:14px;line-height:20px}
.p7-kpis{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
.p7-kpis li{padding:6px 10px;border-radius:10px;background:#fff;font-size:13px;line-height:18px}

/* 7. Tareas: tablero de hoy por persona */
.p7-hoy{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:14px}
.p7-dia-p{display:flex;flex-direction:column;gap:10px;min-width:0;padding:16px;border-radius:16px;background:#F5F5F7}
.p7-dia-p header{display:flex;align-items:center;justify-content:space-between;gap:8px}
.p7-dia-p h3{margin:0;font-size:17px;line-height:22px;font-weight:700}
.p7-dia-p header b{font-size:15px;line-height:20px;font-variant-numeric:tabular-nums}
.p7-tareas{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none}
.p7-tareas li{display:flex;align-items:flex-start;gap:10px;min-height:32px;padding:4px 0;font-size:14px;line-height:20px}
.p7-tareas .p7-gl{width:22px;height:22px;margin-top:-1px}
.p7-tareas .p7-hecho{color:#6E6E73}

/* 8. Founder: de 38 h a 20 h */
.p7-horas{display:flex;flex-direction:column;gap:14px}
.p7-fila{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;align-items:center}
.p7-fila>span{font-size:14px;line-height:20px;font-weight:600}
.p7-dobles{display:flex;flex-direction:column;gap:5px}
.p7-dobles div{display:flex;align-items:center;gap:8px}
.p7-dobles i{display:block;height:12px;border-radius:0 6px 6px 0;min-width:3px;background:#7A1230;transform-origin:left;animation:p7-crece .6s cubic-bezier(.2,.8,.2,1)}
.p7-dobles .p7-m i{background:#fff;border:2px solid #C9798F;height:12px;box-sizing:border-box}
.p7-dobles small{font-size:12px;line-height:16px;color:#424245;white-space:nowrap}
.p7-flecha{display:inline-flex;align-items:center;color:#7A1230}

/* 9. Marca: paleta y tipografía mostradas de verdad */
.p7-paleta{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:12px;margin:0;padding:0;list-style:none}
.p7-muestra{display:flex;flex-direction:column;justify-content:flex-end;gap:2px;min-height:132px;padding:14px;border-radius:16px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.p7-muestra:first-child{grid-column:span 2}
.p7-muestra b{font-size:16px;line-height:22px;font-weight:700}
.p7-muestra span{font-size:13px;line-height:18px;font-variant-numeric:tabular-nums}
.p7-muestra em{font-style:normal;font-size:12px;line-height:16px}
.p7-tipos{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}
.p7-tipos li{display:grid;grid-template-columns:150px minmax(0,1fr);gap:4px 20px;align-items:baseline;padding:14px 0;border-bottom:1px solid rgba(0,0,0,.06)}
.p7-tipos li:last-child{border-bottom:0}
.p7-tipos small{font-size:12px;line-height:16px;color:#6E6E73}
.p7-tipos b{display:block;min-width:0;overflow-wrap:anywhere;font-family:"SF Pro Display",Inter,-apple-system,system-ui,sans-serif;letter-spacing:-.02em;line-height:1.15;color:#1D1D1F}
.p7-tono{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px;margin:0;padding:0;list-style:none}
.p7-tono li{display:flex;flex-direction:column;gap:6px;padding:14px 16px;border-radius:14px;background:#F5F5F7}
.p7-tono b{font-size:12px;line-height:16px;font-weight:600;color:#6E6E73;text-transform:uppercase;letter-spacing:.04em}
.p7-tono q{font-size:17px;line-height:24px;font-weight:600;letter-spacing:-.01em;quotes:"«" "»"}

/* 10. SOPs: departamentos con procedimientos por escribir */
.p7-deps{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:14px;margin:0;padding:0;list-style:none}
.p7-dep{display:flex;flex-direction:column;gap:10px;min-width:0;padding:16px;border-radius:16px;background:#F5F5F7;border-top:6px solid var(--p7-c)}
.p7-dep header{display:flex;align-items:center;justify-content:space-between;gap:8px}
.p7-dep h3{margin:0;font-size:18px;line-height:22px;font-weight:700;letter-spacing:-.02em}
.p7-dep .p7-n{font-size:15px;line-height:20px;font-weight:600;font-variant-numeric:tabular-nums}
.p7-dep ul{display:flex;flex-direction:column;gap:4px;margin:0;padding:0;list-style:none}
.p7-dep li{display:flex;gap:8px;align-items:flex-start;font-size:13px;line-height:18px;color:#424245}
.p7-dep li::before{content:"";flex:none;width:8px;height:8px;margin-top:5px;border-radius:2px;box-shadow:inset 0 0 0 1.5px #6E6E73}
.p7-dep .p7-pie{margin:0;font-size:12px;line-height:16px;color:#6E6E73}

/* 11. Reputación */
.p7-rep{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:28px;align-items:center}
.p7-nota{display:flex;flex-direction:column;gap:6px}
.p7-estrellas{display:flex;gap:2px;color:#7A1230}
.p7-estrellas .p7-vacia{color:#E3B8C5}
.p7-dist{display:flex;flex-direction:column;gap:6px}
.p7-dist div{display:grid;grid-template-columns:78px minmax(0,1fr) 36px;gap:10px;align-items:center;font-size:13px;line-height:18px}
.p7-dist span:last-child{text-align:right;font-weight:600;font-variant-numeric:tabular-nums}
.p7-alerta{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:14px;background:var(--p7-f);color:#1D1D1F;font-size:14px;line-height:20px}
.p7-alerta b{color:var(--p7-c)}
.p7-alerta p{margin:0}

/* 12. Base y tecnología */
.p7-herr{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:12px;margin:0;padding:0;list-style:none}
.p7-herr li{display:flex;flex-direction:column;gap:4px;min-width:0;padding:14px 16px;border-radius:14px;background:#F5F5F7}
.p7-herr h3{margin:0;font-size:16px;line-height:22px;font-weight:600}
.p7-herr p{margin:0;font-size:13px;line-height:18px;color:#424245}
.p7-herr .p7-coste{margin-top:auto;padding-top:6px;font-size:20px;line-height:24px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.p7-herr .p7-coste small{font-size:12px;font-weight:500;color:#6E6E73;letter-spacing:0}

/* Foco visible */
.p7-ver button:focus-visible{outline:2px solid #7A1230;outline-offset:2px}

@media (max-width:760px){
  .p7-paneles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .p7-riesgos,.p7-legal,.p7-rep{grid-template-columns:minmax(0,1fr);gap:20px}
  .p7-cifra{font-size:48px;line-height:52px}
  .p7-muestra:first-child{grid-column:span 1}
  .p7-tipos li{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:480px){
  .p7-paneles{grid-template-columns:minmax(0,1fr)}
  .p7-check li{grid-template-columns:auto minmax(0,1fr)}
  .p7-check li>.p7-tag{grid-column:2;justify-self:start}
  .p7-cal li{grid-template-columns:56px minmax(0,1fr)}
  .p7-cal li>.p7-tag{grid-column:2;justify-self:start}
  .p7-fila{grid-template-columns:minmax(0,1fr)}
  .p7-dist div{grid-template-columns:70px minmax(0,1fr) 32px}
}
@media (prefers-reduced-motion:reduce){
  .p7-bar i,.p7-dobles i{animation:none}
  .p7-panel,.p7-reparto i,.p7-anillo .p7-arco{transition:none}
  .p7-panel:hover{transform:none}
}