/* 段取り Planning por pasos (orden AAA, 24-oct-2026) · js/plan-pasos.js · referencia: docs/disenos-aprobados/TacticoPasos*.html */
.pp { --pp-card: rgba(18,21,29,.86); --pp-in: #1A1D27; --pp-line: #262A38; --pp-mut: #9AA1B5; --pp-tx: #E9E6DF; --pp-tq: #2EE6D6; --pp-au: #FFB21A; --pp-rd: #FF2E4D; --pp-or: #FF9F43; --pp-gr: #3DDC84;
  display: flex; flex-direction: column; gap: 16px; margin-bottom: 22px; color: var(--pp-tx); font-family: Outfit, system-ui, sans-serif; container-type: inline-size; width: 100%; min-width: 0; box-sizing: border-box; }
.pp :where(h3, span, p, b, small, button, a, li, label, td, th) { text-transform: none; }
.pp :where(h3, p, b, small, li, label, td, span) { letter-spacing: normal; }
.pp-mut { color: var(--pp-mut); } .pp .sm { font-size: 13px; }
.pp-k { font-family: 'Noto Sans JP', sans-serif; font-weight: 700; font-size: 12px; letter-spacing: .2em; color: var(--pp-rd); }
.pp-6 { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.pp-6s { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--pp-line); background: var(--pp-card); color: inherit; text-decoration: none; min-width: 0; }
.pp-6s:hover { border-color: rgba(46,230,214,.5); }
.pp-6n { font-family: Syncopate, sans-serif; font-weight: 700; font-size: 9px; letter-spacing: .16em; color: var(--pp-mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pp-6l { font-size: 14px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .pp-6l span { color: var(--pp-rd); font-family: 'Noto Sans JP', sans-serif; font-weight: 700; margin-right: 4px; }
.pp-6s.ok .pp-6n { color: var(--pp-gr); } .pp-6s.on { border-color: var(--pp-tq); background: linear-gradient(160deg, rgba(46,230,214,.14), var(--pp-card) 60%); } .pp-6s.on .pp-6n { color: var(--pp-tq); }
.pp-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 18px; align-items: start; }
.pp-main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.pp-card { background: var(--pp-card); border: 1px solid var(--pp-line); border-radius: 16px; padding: 20px 22px; display: flex; flex-direction: column; gap: 12px; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.pp-sh { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.pp-sh > div { display: flex; flex-direction: column; gap: 4px; } .pp-sh h3 { margin: 0; font-size: 20px; font-weight: 600; }
.pp-cnt { font-size: 13px; padding: 6px 12px; border-radius: 99px; background: rgba(46,230,214,.12); color: var(--pp-tq); white-space: nowrap; }
.pp-b { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 16px; border-radius: 10px; border: 0; background: var(--pp-tq); color: #0B0D12; font: 600 14px Outfit, sans-serif; cursor: pointer; text-decoration: none; }
.pp-b.ghost { background: transparent; color: var(--pp-tx); border: 1px solid var(--pp-line); font-weight: 500; } .pp-b.ghost:hover { border-color: var(--pp-tq); }
.pp-b:focus-visible, .pp-op:focus-visible, .pp-mix:focus-visible, .pp-th:focus-visible, .pp-6s:focus-visible { outline: 2px solid var(--pp-tq); outline-offset: 2px; }
/* tareas */
.pp-t { border: 1px solid var(--pp-line); border-radius: 14px; background: rgba(26,29,39,.55); }
.pp-t.ok { border-color: rgba(61,220,132,.25); }
.pp-th { all: unset; box-sizing: border-box; width: 100%; cursor: pointer; display: grid; grid-template-columns: 22px auto 1fr auto; gap: 12px; align-items: center; padding: 14px 16px; }
.pp-ck { color: var(--pp-mut); font-size: 15px; } .pp-t.ok .pp-ck { color: var(--pp-gr); }
.pp-tn { font-size: 15px; font-weight: 600; } .pp-tr { font-size: 13px; color: var(--pp-mut); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .pp-ver { font-size: 13px; color: var(--pp-tq); white-space: nowrap; }
.pp-t.abierta { border-color: rgba(46,230,214,.5); padding: 16px 18px; display: flex; flex-direction: column; gap: 12px; background: linear-gradient(160deg, rgba(46,230,214,.07), rgba(26,29,39,.6) 50%); }
.pp-th0 { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; } .pp-th0 > div { display: flex; gap: 10px; align-items: center; }
.pp-tag { font-family: Syncopate, sans-serif; font-weight: 700; font-size: 9px; letter-spacing: .14em; padding: 4px 8px; border-radius: 6px; background: rgba(61,220,132,.14); color: var(--pp-gr); }
.pp-prop { font-size: 13px; color: var(--pp-tq); }
.pp-qps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.pp-qps > div { background: var(--pp-in); border-radius: 10px; padding: 10px 12px; } .pp-qps span { font-family: Syncopate, sans-serif; font-weight: 700; font-size: 9px; letter-spacing: .16em; color: var(--pp-mut); } .pp-qps p { margin: 4px 0 0; font-size: 13.5px; line-height: 1.45; }
.pp-res { background: var(--pp-in); border-radius: 10px; padding: 12px 14px; font-size: 15px; }
.pp-ops { display: flex; flex-wrap: wrap; gap: 8px; }
.pp-op { min-height: 40px; padding: 0 14px; border-radius: 99px; border: 1px solid var(--pp-line); background: transparent; color: var(--pp-tx); font: 500 14px Outfit, sans-serif; cursor: pointer; }
.pp-op.on { background: rgba(46,230,214,.16); border-color: var(--pp-tq); color: var(--pp-tq); }
.pp-ed { display: flex; flex-wrap: wrap; gap: 10px; } .pp-ed label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--pp-mut); } .pp-ed .pp-w { flex: 1 1 100%; } .pp-ed .in { min-height: 40px; }
.pp-tacts { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
/* mezclas */
.pp-mixes { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.pp-mix { position: relative; display: flex; flex-direction: column; gap: 6px; text-align: left; padding: 16px 14px 14px; border-radius: 14px; border: 1px solid var(--pp-line); background: var(--pp-in); color: var(--pp-tx); font: inherit; cursor: pointer; min-height: 140px; }
.pp-mix:hover { border-color: rgba(46,230,214,.5); }
.pp-mix.rec { border-color: rgba(255,178,26,.55); } .pp-mix.on { border-color: var(--pp-tq); background: linear-gradient(160deg, rgba(46,230,214,.16), var(--pp-in) 60%); box-shadow: 0 0 26px rgba(46,230,214,.14); }
.pp-rec { position: absolute; top: -9px; left: 12px; font-family: Syncopate, sans-serif; font-weight: 700; font-size: 8.5px; letter-spacing: .14em; padding: 3px 7px; border-radius: 6px; background: var(--pp-au); color: #0B0D12; }
.pp-mjp { font-family: 'Noto Sans JP', sans-serif; font-weight: 700; font-size: 24px; color: var(--pp-rd); line-height: 1; } .pp-mix b { font-size: 15px; font-weight: 600; } .pp-mix small { font-size: 12.5px; color: var(--pp-mut); line-height: 1.4; }
.pp-medios { display: flex; flex-wrap: wrap; gap: 8px; } .pp-med { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--pp-line); font-size: 14px; cursor: pointer; } .pp-med small { color: var(--pp-mut); }
.pp-why { font-size: 14px; line-height: 1.5; }
.pp-ul { margin: 6px 0 0; padding-left: 18px; font-size: 13.5px; line-height: 1.5; } .pp-ul li { margin: 2px 0; }
.pp-avisos { border: 1px solid rgba(255,159,67,.45); background: rgba(255,159,67,.08); border-radius: 12px; padding: 12px 14px; font-size: 14px; } .pp-avisos > b { color: var(--pp-or); }
.pp-nav { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
/* plan en vivo */
.pp-vivo { position: sticky; top: calc(var(--toph, 80px) + 12px); background: var(--pp-card); border: 1px solid var(--pp-line); border-radius: 16px; padding: 18px; display: flex; flex-direction: column; gap: 8px; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.pp-vh { display: flex; justify-content: space-between; align-items: center; } .pp-vh .pp-k { font-family: Syncopate, sans-serif; font-size: 10px; letter-spacing: .2em; color: var(--pp-tq); } .pp-vjp { font-family: 'Noto Sans JP', sans-serif; font-weight: 700; color: var(--pp-rd); }
.pp-vf { display: flex; justify-content: space-between; gap: 10px; font-size: 13.5px; padding: 6px 0; border-bottom: 1px solid rgba(38,42,56,.6); } .pp-vf span { color: var(--pp-mut); } .pp-vf b { font-weight: 500; text-align: right; overflow-wrap: anywhere; }
.pp-alfa { margin-top: 6px; border: 1px solid rgba(255,178,26,.4); border-radius: 12px; padding: 10px 12px; font-size: 13.5px; } .pp-alfa p { margin: 4px 0 0; color: var(--pp-mut); line-height: 1.45; } .pp-a { color: var(--pp-au); font-family: Cinzel, serif; }
/* tablas del paso 4 y reporte */
.pp-tw { overflow-x: auto; } .pp-tb { width: 100%; border-collapse: collapse; font-size: 13.5px; } .pp-tb th { text-align: left; font-weight: 500; color: var(--pp-mut); font-size: 12px; padding: 8px; border-bottom: 1px solid var(--pp-line); } .pp-tb td { padding: 9px 8px; border-bottom: 1px solid rgba(38,42,56,.6); vertical-align: top; } .pp-tb .n { text-align: right; white-space: nowrap; }
.pp-ok { color: var(--pp-gr); } .pp-med2 { color: var(--pp-or); } .pp-mal { color: var(--pp-rd); }
.pp-val { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 10px 0; border-top: 1px solid rgba(38,42,56,.6); } .pp-val p { margin: 4px 0 0; }
.pp-tagw { background: rgba(255,159,67,.14); color: var(--pp-or); }
.pp-lnk { all: unset; cursor: pointer; color: var(--pp-tq); font-size: 13px; } .pp-lnk:hover { text-decoration: underline; }
.pp-ops4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.pp-opo { display: flex; flex-direction: column; gap: 6px; padding: 14px; border-radius: 14px; border: 1px solid var(--pp-line); background: var(--pp-in); } .pp-opo.on { border-color: rgba(61,220,132,.5); }
.pp-opo b { font-size: 15px; } .pp-opo p { margin: 0; font-size: 13px; line-height: 1.45; color: var(--pp-mut); flex: 1; } .pp-opo .pp-tacts { justify-content: flex-start; align-items: center; }
.pp-alpha { border-color: rgba(255,178,26,.4); }
@container (max-width: 1040px) { .pp-grid { grid-template-columns: 1fr; } .pp-vivo { position: static; } .pp-mixes { grid-template-columns: repeat(3, 1fr); } }
@container (max-width: 640px) { .pp-ops4 { grid-template-columns: 1fr 1fr; } .pp-val { flex-direction: column; } .pp-qps { grid-template-columns: 1fr; } .pp-mixes { grid-template-columns: 1fr 1fr; } .pp-6 { display: flex; overflow-x: auto; scrollbar-width: none; } .pp-6s { flex: none; min-width: 120px; } }
@media (max-width: 760px) {
  .pp-6 { display: flex; overflow-x: auto; scrollbar-width: none; } .pp-6s { flex: none; min-width: 120px; }
  .pp-card { padding: 16px; } .pp-qps { grid-template-columns: 1fr; } .pp-mixes { grid-template-columns: 1fr 1fr; }
  .pp-th { grid-template-columns: 22px 1fr auto; } .pp-tr { grid-column: 2 / -1; white-space: normal; } .pp-ver { grid-row: 1; grid-column: 3; }
  .pp-nav > .pp-mut { order: -1; width: 100%; } .pp-nav .pp-b { flex: 1; }
}

/* 報告 Paso 6 · Reporte (js/reporte-paso.js) */
.rp-h { font-family: Cinzel, serif; font-size: clamp(20px, 2.2vw, 28px) !important; letter-spacing: .04em !important; }
.rp-tabs { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; } .rp-tabs .pp-b { margin-left: auto; } .rp-tabs span[lang] { color: var(--pp-rd); font-family: 'Noto Sans JP', sans-serif; font-weight: 700; margin-right: 4px; }
.rp-etq { font-family: Syncopate, sans-serif; font-weight: 700; font-size: 8.5px; letter-spacing: .12em !important; text-transform: uppercase !important; padding: 3px 7px; border-radius: 6px; white-space: nowrap; align-self: flex-start; }
.rp-real { background: rgba(61,220,132,.14); color: var(--pp-gr); } .rp-est { background: rgba(255,159,67,.14); color: var(--pp-or); } .rp-pub { background: rgba(154,161,181,.16); color: var(--pp-mut); }
.pp-gris { color: var(--pp-mut); }
.rp-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } .rp-col { background: var(--pp-in); border-radius: 12px; padding: 12px 14px; border-left: 3px solid var(--pp-mut); } .rp-col > span { font-family: Syncopate, sans-serif; font-weight: 700; font-size: 9px; letter-spacing: .18em !important; } .rp-col p { margin: 8px 0 0; font-size: 14px; line-height: 1.45; }
.rp-col.ok { border-color: var(--pp-gr); } .rp-col.ok > span { color: var(--pp-gr); } .rp-col.mal { border-color: var(--pp-rd); } .rp-col.mal > span { color: var(--pp-rd); }
.pp-fila2 { display: flex; flex-direction: column; gap: 2px; padding: 8px 0; border-bottom: 1px solid rgba(38,42,56,.6); font-size: 14px; }
.rp-ol { margin: 0; padding-left: 20px; font-size: 15px; line-height: 1.55; } .rp-ol li { margin: 4px 0; }
.rp-frase { margin: 0; font-size: 19px; line-height: 1.5; font-weight: 500; background: var(--pp-in); border-radius: 12px; padding: 16px 18px; }
.rp-ad { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.rp-m { display: flex; flex-direction: column; gap: 8px; border: 1px solid var(--pp-line); border-radius: 12px; padding: 12px; } .rp-m > span { font-size: 13px; color: var(--pp-mut); }
.rp-v { display: flex; align-items: center; gap: 8px; } .rp-v > div { display: flex; flex-direction: column; } .rp-v small { font-size: 11px; color: var(--pp-mut); } .rp-v b { font-size: 22px; font-weight: 600; } .rp-v i { color: var(--pp-tq); font-style: normal; }
@container (max-width: 640px) { .rp-2 { grid-template-columns: 1fr; } .rp-ad { grid-template-columns: 1fr 1fr; } .rp-tabs .pp-b { margin-left: 0; } }
/* el estilo general de títulos del portal no aplica dentro de los pasos */
.pp .pp-sh h3:not(.rp-h) { font-family: Outfit, system-ui, sans-serif !important; font-size: 20px !important; font-weight: 600 !important; letter-spacing: normal !important; text-transform: none !important; }
.pp .pp-sh::after, .pp .pp-sh *::after, .pp .pp-sh::before, .pp .pp-sh *::before { content: none !important; display: none !important; }
.pp .rp-etq { font-size: 8.5px !important; letter-spacing: .12em !important; line-height: 1.4; }

/* 評議 Sala del Consejo (js/consejo.js) */
.cs-mesa { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.cs-m { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; padding: 20px 14px; border-radius: 16px; border: 1px solid color-mix(in srgb, var(--cs) 40%, transparent); background: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, var(--cs) 16%, transparent), transparent 65%), var(--pp-card); }
.cs-jefe { box-shadow: 0 0 34px color-mix(in srgb, var(--cs) 22%, transparent); }
.cs-sw { width: 84px; height: 84px; display: grid; place-items: center; border-radius: 50%; background: #07080C; border: 1px solid color-mix(in srgb, var(--cs) 45%, transparent); box-shadow: 0 0 22px color-mix(in srgb, var(--cs) 30%, transparent); }
.cs-sello { width: 62%; height: 62%; filter: drop-shadow(0 0 8px color-mix(in srgb, var(--cs, #fff) 60%, transparent)); }
.cs-n { font-family: Cinzel, serif; font-size: 20px; letter-spacing: .06em !important; color: var(--cs); }
.cs-rol { font-size: 13px; font-weight: 600; } .cs-rol span { font-family: 'Noto Sans JP', sans-serif; color: var(--cs); margin-right: 4px; }
.cs-m p { margin: 0; font-size: 13px; line-height: 1.45; color: var(--pp-mut); flex: 1; }
.cs-st { font-size: 12px; padding: 4px 10px; border-radius: 99px; background: rgba(154,161,181,.14); color: var(--pp-mut); } .cs-st.on { background: rgba(61,220,132,.14); color: var(--pp-gr); } .cs-st.off { background: rgba(255,159,67,.14); color: var(--pp-or); }
.cs-t { font-size: 17px; }
@container (max-width: 900px) { .cs-mesa { grid-template-columns: repeat(3, 1fr); } }
@container (max-width: 560px) { .cs-mesa { grid-template-columns: 1fr 1fr; } .cs-jefe { grid-column: 1 / -1; } }
