/* v25 · Método.
   1. «El perfil, a la vista»: las cinco dimensiones como tablas de un barril.
      El agua sube hasta la más corta (nivel declarado); el promedio queda
      marcado con trazo para ver lo que escondería. Se actualiza con la matriz.
   2. En la práctica: el ciclo vuelve a empezar cada año. */

/* 1 · Barril */
.mbar{ margin:var(--e-md) 0 0; padding:var(--e-md) 0 0; border-top:1px solid rgba(216,203,179,.16) }
.mbar__lam{ position:relative; height:12rem; display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:.25rem; --pie:1.5rem; --alto:calc(100% - var(--pie) - 1.4rem) }
.mbar__d{ position:relative; height:100% }
.mbar__d i{ position:absolute; left:16%; right:16%; bottom:var(--pie); height:calc(var(--alto) * var(--v) / 5);
  border-radius:5px 5px 2px 2px; background:linear-gradient(180deg, #A9C3C6, #6F9296); transition:height .45s var(--curva), background-color .3s }
.mbar__d[data-baja] i{ background:linear-gradient(180deg, #E8BE63, var(--sol-hondo)) }
.mbar__d span{ position:absolute; left:0; right:0; bottom:0; text-align:center; font-family:var(--sans); font-size:.78rem; font-weight:600; color:var(--suave-claro) }
.mbar__d[data-baja] span{ color:var(--sol) }

.mbar__agua{ position:absolute; z-index:2; left:-.25rem; right:-.25rem; bottom:var(--pie); height:calc(var(--alto) * var(--n) / 5);
  background:linear-gradient(180deg, rgba(124,196,190,.26), rgba(124,196,190,.12)); border-top:2px solid #9FD6D0; border-radius:0 0 6px 6px;
  transition:height .45s var(--curva); pointer-events:none }
.mbar__prom{ position:absolute; z-index:3; left:-.25rem; right:-.25rem; bottom:calc(var(--pie) + var(--alto) * var(--p) / 5); height:0;
  border-top:1.5px dashed rgba(244,242,238,.75); transition:bottom .45s var(--curva); pointer-events:none }
.mbar__agua span,.mbar__prom span{ position:absolute; bottom:100%; margin-bottom:.3rem; font-family:var(--sans); font-size:.76rem; font-weight:600; white-space:nowrap; line-height:1.2;
  padding:.12rem .4rem; border-radius:4px; background:rgba(10,26,47,.85) }
.mbar__agua span{ left:.25rem; color:#BFE6E1 }
.mbar__prom span{ right:.25rem; color:var(--papel) }
.mbar__prom[data-oculto]{ opacity:0 }
.mbar__agua b,.mbar__prom b{ font-weight:700 }
.mbar__pie{ margin-top:var(--e-sm); font-family:var(--sans); font-size:.9rem; line-height:1.55; color:#C9D3D6; max-width:44ch }
.mbar__pie b{ color:var(--papel); font-weight:650 }

@media (prefers-reduced-motion:reduce){
  .mbar__d i,.mbar__agua,.mbar__prom{ transition:none }
}

/* 2 · El ciclo vuelve a empezar */
.mpra__vuelta{ display:flex; align-items:center; justify-content:center; gap:.55rem; max-width:76rem; margin:var(--e-lg) auto 0;
  font-family:var(--sans); font-size:.98rem; font-weight:600; color:var(--petroleo); text-align:center; text-wrap:balance; padding-inline:.5rem }
.mpra__vuelta svg{ width:1.25rem; height:1.25rem; flex:none }
@media (min-width:60rem){
  .mpra__vuelta{ position:relative; padding-top:2.1rem; margin-top:var(--e-md) }
  .mpra__vuelta::before{ content:""; position:absolute; top:0; left:12.5%; right:12.5%; height:1.1rem;
    border:2px solid rgba(20,80,79,.45); border-top:0; border-radius:0 0 14px 14px }
  .mpra__vuelta::after{ content:""; position:absolute; top:-.2rem; left:calc(12.5% - 5px); width:0; height:0;
    border-left:6px solid transparent; border-right:6px solid transparent; border-bottom:8px solid rgba(20,80,79,.7) }
  .mpra__vuelta svg{ display:none }
}

/* ============================================================================
   v28 (BRIEF_v28, lista negra anti-IA). Fuera las cajas tintadas que solo
   decoran, la píldora con punto de la apertura y los rellenos degradados del
   barril. El barril, la brújula y la matriz (lo aprobado) siguen igual.
   ========================================================================== */

/* Apertura: rótulo de texto (antes, píldora con punto) */
.map__k{ margin:0; font-family:var(--sans); font-size:1rem; font-weight:600; color:var(--sol-2) }

/* Índice de la página: los cinco pasos con su número, sin cajas */
.mrec ol{ position:relative; gap:1.25rem .75rem }
.mrec a{ background:none; box-shadow:none; border-radius:10px; padding:.6rem .5rem .8rem }
.mrec a:hover{ background:none; transform:none }
.mrec a:hover b{ text-decoration:underline; text-underline-offset:.2em; text-decoration-thickness:1.5px }
.mrec a:focus-visible{ outline:2px solid var(--sol-2); outline-offset:2px }
@media (prefers-reduced-motion:reduce){ .mrec a{ transition:none } }

/* La fórmula: los tres factores se leen como la ecuación, separados por «×», sin tarjetas */
.mfac{ gap:var(--e-lg) }
.mfac__i{ position:relative; background:none; box-shadow:none; border-radius:0; padding:.25rem .5rem }
.mfac__x{ width:auto; height:auto; background:none; border-radius:0; font-family:var(--lee); font-weight:500; font-size:3rem; line-height:1; color:var(--sol-2); transition:color .3s ease }
.mfac__i[data-nivel="bajo"]{ box-shadow:none }
.mfac__i[data-nivel="bajo"] .mfac__x{ color:#E88C64 }
.mfac__i[data-nivel="cero"]{ box-shadow:none; opacity:.6 }
.mfac__i[data-nivel="cero"] .mfac__x{ color:#E88C64; text-decoration:line-through; text-decoration-thickness:3px }
@media (min-width:52rem){
  .mfac__i + .mfac__i::before{ content:"×"; position:absolute; left:calc(var(--e-lg) / -2); top:.4rem; transform:translateX(-50%);
    font-family:var(--sans); font-size:1.8rem; font-weight:500; color:var(--sol-2); opacity:.7 }
}
.mlog__inst{ background:none; padding:0 }
.mlog__por{ background:none; box-shadow:none; border-radius:0; padding:0 }
.mlog__por p:not(.mlog__pk){ font-family:var(--lee); font-size:clamp(1.1rem,1rem + .4vw,1.3rem); line-height:1.6 }

/* El instrumento: aviso en una línea y las tres piezas sin tarjetas */
.instrumento .aviso-propuesta{ background:none; box-shadow:none; padding:0; border-radius:0 }
.mict__i,.mict__i--regla{ background:none; box-shadow:none; border-radius:0; padding:.5rem .5rem 0 }
.mict__n{ font-family:var(--lee); font-weight:500; font-size:3.4rem }

/* El instrumento hermano: el rol como texto, sin píldora */
.mdos__rol{ padding:0; border-radius:0; box-shadow:none }

/* Barril: tablas de color pleno (sin degradado de relleno) */
.mbar__d i{ background:#8DADB0 }
.mbar__d[data-baja] i{ background:var(--sol) }
.mbar__agua{ background:rgba(124,196,190,.2) }
