/* PAD ST/SC 112-2025 | Anexo 02 | cronología web editable (HTML + CSS).
   Patch visual 2026-10-15: composición y proporciones de la lámina 16:9 de referencia.
   Sólo afecta el gráfico con clases .timeline-* / .chrono-*.
*/
.timeline-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:12px 0 10px}
.timeline-controls span{font-size:11px;color:#5c7278}
.timeline-expand-link{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:8px;background:#e7f1fb;border:1px solid #8db9e7;color:#155483!important;font-size:12px;font-weight:800;text-decoration:none!important;box-shadow:0 2px 4px rgba(40,85,130,.08)}
.timeline-expand-link:hover,.timeline-expand-link:focus-visible{background:#d5eaff;outline:2px solid #2e77c4;outline-offset:2px}
.timeline-overflow{overflow-x:auto;overflow-y:hidden;width:100%;max-width:100%;padding:8px 6px 10px;background:#fff;border:1px solid #dbe3e9;border-radius:11px;scrollbar-color:#84a9ce #e8f0f8;scrollbar-width:thin}
.timeline-overflow:focus-visible{outline:3px solid #187ab4;outline-offset:3px}
.timeline-board{box-sizing:border-box;display:grid;grid-template-columns:minmax(312px,1.08fr) minmax(585px,2.03fr) minmax(298px,1.04fr) minmax(241px,.84fr);gap:10px;min-width:1470px;min-height:640px;align-items:stretch;font-family:Arial,Helvetica,sans-serif;color:#263d55}
.timeline-board *, .timeline-board *::before,.timeline-board *::after{box-sizing:border-box}
.chrono-panel{display:flex;flex-direction:column;min-width:0;overflow:hidden;border-radius:9px;border:1px solid #c5d0dd;box-shadow:0 3px 6px rgba(39,57,79,.2);background:#fff}
.chrono-panel h4{flex:none;display:grid;place-items:center;text-align:center;min-height:47px;margin:0!important;padding:7px 9px!important;border-radius:8px 8px 5px 5px;background:#3077c4;color:#fff!important;box-shadow:0 2px 4px rgba(35,54,80,.17);font-size:15.2px!important;line-height:1.2!important;font-weight:800!important;letter-spacing:0}
.chrono-blue{background:#e7f1fb;border-color:#aac8e8}
.chrono-red{background:#fff0f0;border-color:#edbbba}
.chrono-red h4{background:#d63336}
.chrono-gray{background:#f0f3f6;border-color:#d0d6dc}
.chrono-gray h4{background:#cbd3de;color:#fff!important}
/* ANTECEDENTES: fechas, línea, círculos, tres tarjetas verticales. */
.chrono-date-rail{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:3px;margin:21px 11px 49px;padding:0 0 26px;color:#234e85;border:0!important;font-size:12px;font-weight:800;line-height:1.2}
.chrono-date-rail::after{content:"";position:absolute;bottom:0;left:2%;right:2%;height:4px;background:#3077c4;box-shadow:0 2px 4px rgba(28,65,109,.26)}
.chrono-date-rail span{text-align:center;white-space:nowrap;position:relative}
.chrono-date-rail span::after{content:"";position:absolute;z-index:3;width:9px;height:9px;border-radius:50%;bottom:-31px;left:calc(50% - 4.5px);background:#3077c4}
.chrono-blue-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:0 5px;align-items:stretch}
.chrono-blue-grid article{min-width:0;min-height:333px;position:relative;background:#fff;border:1.7px solid #90bde8;border-radius:6px;padding:14px 6px 13px;box-shadow:0 3px 4px rgba(31,70,111,.23)}
.chrono-blue-grid article::before{content:"";position:absolute;height:52px;width:2px;background:#3077c4;top:-51px;left:calc(50% - 1px)}
.chrono-blue-grid .chrono-event-icon{position:absolute;z-index:4;display:grid;place-items:center;left:calc(50% - 19px);top:-77px;width:38px;height:38px;border:2px solid #237bd6;border-radius:50%;background:white;color:#2976c7;font-size:19px;box-shadow:0 3px 4px rgba(31,64,106,.3);line-height:1}
.chrono-blue-grid time{display:none}
.chrono-blue-grid strong{display:block;margin-bottom:7px;font-size:13.2px;line-height:1.22;font-weight:800;color:#153c71}
.chrono-panel article p{margin:6px 0 0;font-size:11.9px;line-height:1.46;color:#243e59;text-align:left}
.chrono-observation{align-self:center;max-width:175px;min-height:83px;margin:21px auto 18px;padding:9px 10px;border:1px solid #eabb61;background:#fff3d5;color:#684d1d;font-size:11.7px;line-height:1.42;text-align:left;box-shadow:0 2px 5px rgba(124,89,42,.23);border-radius:3px}
/* CONFLICTO: cuatro columnas (hora + punto + conector + tarjeta) en un único grid; dos mensajes enfatizados. */
.chrono-red{--email-cols:1.15fr .88fr 1.16fr .85fr;--email-gap:7px;--email-side-pad:7px}
.email-stages{display:grid;grid-template-columns:var(--email-cols);align-items:stretch;gap:var(--email-gap);position:relative;margin:0;padding:28px var(--email-side-pad) 0;flex:none}
.email-stages::before{content:"";position:absolute;z-index:0;top:64px;left:calc(var(--email-side-pad) + 3px);right:calc(var(--email-side-pad) + 3px);height:4px;background:#d23334;box-shadow:0 2px 4px rgba(109,43,52,.22)}
.email-stage{display:flex;flex-direction:column;min-width:0}
.email-time{display:block;position:relative;flex:none;padding-bottom:66px;color:#284267;font-weight:800;font-size:13.5px;line-height:1.2;text-align:center;white-space:nowrap;letter-spacing:.1px}
.email-time::after{content:"";position:absolute;z-index:2;top:31px;left:0;right:0;margin:0 auto;width:14px;height:14px;border:2px solid #cf3638;background:#fff;border-radius:50%;box-shadow:0 1px 3px rgba(142,29,38,.3)}
.email-time::before{content:"";position:absolute;z-index:1;top:45px;bottom:0;left:0;right:0;margin:0 auto;width:2px;background:#397ac8}
.email-time.key{color:#b7292f}
.email-time.key::after{background:#cc3439;border-color:#cc3439}
.email-time.key::before{background:#d73538}
.email-stage article{position:relative;flex:1 0 auto;min-width:0;min-height:331px;background:#fff;border:1.7px solid #8abce7;border-radius:7px;padding:12px 9px 13px;text-align:center;box-shadow:0 3px 5px rgba(45,76,110,.23)}
.email-stage article strong{display:block;color:#153d75;font-size:12.9px;line-height:1.28;font-weight:800}
.email-stage article p{text-align:center;font-size:11.8px;line-height:1.47;margin:11px 0 0}
.email-stage article.critical{background:#fff0f0;border-color:#d73538;box-shadow:0 3px 5px rgba(139,43,50,.22)}
.email-stage article.critical strong{font-size:12.6px;line-height:1.38;color:#c1242b}
.email-stage article.critical span:not(.chrono-card-symbol){display:block;margin:0 0 8px;color:#bf272e;font-size:12px;line-height:1.35;font-weight:800}
.chrono-card-symbol{display:block!important;margin:0 0 7px!important;color:#c53133!important;font-size:19px!important;line-height:1.1!important}
.chrono-thesis{margin:24px auto 23px;max-width:79%;border:2px solid #2b7fd6;border-radius:11px;background:#edf5ff;padding:14px 15px 15px;text-align:center;box-shadow:0 3px 6px rgba(44,89,151,.22)}
.chrono-thesis strong{font-size:15px;line-height:1.3;color:#153d73}
.chrono-thesis p{font-size:12.3px;line-height:1.45;color:#183f75;margin:7px 0 0}
/* ACTUACIONES Y TRÁMITE: línea vertical con círculos e hitos encadenados. */
.chrono-vertical-events{display:flex;flex:1;flex-direction:column;justify-content:space-around;gap:15px;position:relative;margin:22px 10px 15px 32px;padding:6px 0 4px 32px;border-left:3px solid #2d78ca}
.chrono-vertical-events article{position:relative;flex:none;min-width:0;min-height:91px;padding:15px 10px 10px;border:1.5px solid #92bce5;border-radius:6px;background:#fff;box-shadow:0 3px 5px rgba(54,94,133,.22)}
.chrono-vertical-events article::before{content:"";position:absolute;left:-43px;top:33px;width:14px;height:14px;background:#3077c4;border:2px solid #3077c4;border-radius:50%;box-shadow:0 1px 3px rgba(34,68,120,.18)}
.chrono-vertical-events article::after{content:"✉";position:absolute;display:grid;place-items:center;left:-54px;top:14px;width:37px;height:37px;border-radius:50%;background:#3077c4;color:#fff;font-size:17px;box-shadow:0 3px 5px rgba(47,78,111,.27)}
.chrono-related .chrono-vertical-events article:nth-child(1)::after{content:"▦"}
.chrono-related .chrono-vertical-events article:nth-child(2)::after{content:"✉"}
.chrono-related .chrono-vertical-events article:nth-child(3)::after{content:"▤"}
.chrono-related .chrono-vertical-events article:nth-child(4)::after{content:"▥"}
.chrono-vertical-events time{position:absolute;left:1px;top:-21px;display:block;font-size:12px;line-height:1.2;font-weight:800;color:#2269b2;white-space:nowrap}
.chrono-vertical-events strong{display:block;color:#153b70;font-weight:800;font-size:12.4px;line-height:1.25;text-align:center}
.chrono-vertical-events article p{font-size:11.6px;line-height:1.45;margin:7px 0 0}
.chrono-gray .chrono-vertical-events{margin:16px 9px 13px 31px;padding-left:23px;border-left:3px solid #87939f}
.chrono-gray .chrono-vertical-events article{min-height:57px;padding:10px 7px 9px;border:1.4px solid #c8ced4;border-radius:7px;box-shadow:0 3px 5px rgba(67,72,83,.19)}
.chrono-gray .chrono-vertical-events article::before{left:-34px;top:21px;background:#76818e;border-color:#76818e}
.chrono-gray .chrono-vertical-events article::after{left:-45px;top:2px;width:35px;height:35px;background:#717e8d;font-size:17px}
.chrono-gray .chrono-vertical-events article:nth-child(1)::after{content:"▤"}
.chrono-gray .chrono-vertical-events article:nth-child(2)::after{content:"▦"}
.chrono-gray .chrono-vertical-events article:nth-child(3)::after{content:"♟"}
.chrono-gray .chrono-vertical-events article:nth-child(4)::after{content:"⚖"}
.chrono-gray .chrono-vertical-events article:nth-child(5)::after{content:"⚑"}
.chrono-gray .chrono-vertical-events time{top:-19px;color:#687681;font-size:11.3px}
.chrono-gray .chrono-vertical-events strong{font-size:11.4px;line-height:1.28;color:#263d56;text-align:left;font-weight:500}
.timeline-caption{margin:12px 1px 0!important;padding:13px 15px 13px 20px;border:1.5px solid #3b86d0;border-left:6px solid #3b86d0;border-radius:9px;background:#eef6ff;color:#173f70!important;font-size:12.5px!important;line-height:1.55!important;box-shadow:0 2px 4px rgba(33,83,139,.12)}
.timeline-caption strong{color:#134278}
.timeline-tip{color:#6b7f85!important;font-size:11px!important;margin:7px 0 0!important}
/* Vista ampliada sin barra lateral (archivo separado). */
.chronology-standalone{background:#f4f8fb;font:14px Arial,Helvetica,sans-serif;margin:0;color:#243b51}
.chronology-standalone .standalone-top{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;padding:15px max(18px,2.5vw);background:white;border-bottom:1px solid #d9e5ef}
.chronology-standalone .standalone-top strong{font-size:17px;color:#214a6f}
.chronology-standalone .standalone-top a{color:#1266ac;text-decoration:none;font-weight:700}
.chronology-standalone main{max-width:1830px;margin:0 auto;padding:22px 18px 35px}
.chronology-standalone h1{font-size:clamp(20px,2.2vw,28px);color:#244c72;margin:0 0 8px}
.chronology-standalone .standalone-subtitle{font-size:13px;line-height:1.55;color:#536a7c;margin:0 0 16px}
.chronology-standalone .timeline-board{min-height:650px}
@media(max-width:800px){.timeline-controls span{display:none}.timeline-board{min-width:1470px}.timeline-overflow{padding:5px}.timeline-expand-link{font-size:11px}}
@media print{
 .timeline-controls,.timeline-tip{display:none!important}
 .timeline-overflow{overflow:visible!important;max-width:none;border:none;padding:0;background:white}
 .timeline-board{min-width:1470px;min-height:620px;break-inside:avoid;print-color-adjust:exact;-webkit-print-color-adjust:exact}
 .chrono-panel{break-inside:avoid}
 .chronology-standalone main{max-width:none;padding:5px}
 .chronology-standalone .standalone-top{display:none}
 @page{size:A3 landscape;margin:10mm}
}


/* FASE 2B: animaciones discretas y ficha de hitos interactiva. */
.timeline-board .chrono-blue-grid article,
.timeline-board .email-stage article,
.timeline-board .chrono-vertical-events article{
  cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background-color .18s ease;
  outline-offset:3px;
}
.timeline-board .chrono-blue-grid article:hover,
.timeline-board .email-stage article:hover,
.timeline-board .chrono-vertical-events article:hover,
.timeline-board .chrono-blue-grid article:focus-visible,
.timeline-board .email-stage article:focus-visible,
.timeline-board .chrono-vertical-events article:focus-visible{
  transform:translateY(-5px);
  box-shadow:0 10px 19px rgba(34,69,105,.28);
  border-color:#237bd6;
  position:relative;
  z-index:5;
}
.timeline-board .email-stage article.critical:hover,
.timeline-board .email-stage article.critical:focus-visible{
  border-color:#a91e29;
  box-shadow:0 9px 20px rgba(172,35,42,.28);
}
.timeline-board [role="button"]:focus-visible{outline:3px solid #2486cf}
.timeline-board article[data-active-event="true"]{
  border-color:#116fc1!important;
  outline:3px solid rgba(42,132,220,.35);
  box-shadow:0 10px 21px rgba(26,85,151,.26)!important;
  z-index:6;
  position:relative;
}
.timeline-board article.critical[data-active-event="true"]{
  outline-color:rgba(209,35,47,.37);
  border-color:#bd202e!important;
}
.timeline-board .email-time[data-time-target]{cursor:pointer;transition:color .16s ease}
.timeline-board .email-time[data-time-target]:hover,
.timeline-board .email-time[data-time-target]:focus-visible{color:#ad252e;outline-offset:5px}
.timeline-board .email-time[data-time-target]:hover::after,
.timeline-board .email-time[data-time-target]:focus-visible::after{transform:scale(1.3);box-shadow:0 0 0 5px rgba(205,50,58,.13)}
.timeline-board .email-time[data-time-target]::after{transition:transform .16s ease,box-shadow .16s ease}
.timeline-tip{line-height:1.6!important}
/* Tarjeta de detalle: aparece al hacer clic, sin modificar la retícula original. */
.chrono-event-dialog[hidden]{display:none!important}
.chrono-event-dialog{
  position:fixed;right:clamp(12px,2vw,30px);bottom:clamp(12px,2vw,30px);z-index:10000;
  width:min(410px,calc(100vw - 24px));max-height:min(62vh,440px);overflow:auto;
  padding:17px 19px 18px;background:#fff;border:1px solid #8bb8df;border-top:5px solid #2f7cc4;
  border-radius:12px;box-shadow:0 18px 50px rgba(10,40,65,.3);color:#213c5b;
  font-family:Arial,Helvetica,sans-serif;line-height:1.5;
  animation:chrono-popup-in .19s ease-out;
}
.chrono-event-dialog.is-critical{border-top-color:#d3353d}
.chrono-event-dialog .chrono-detail-kicker{display:block;color:#4177a5;font-weight:800;letter-spacing:.08em;font-size:10px;text-transform:uppercase;margin:0 40px 7px 0}
.chrono-event-dialog.is-critical .chrono-detail-kicker{color:#b22933}
.chrono-event-dialog .chrono-detail-date{font-size:12px;font-weight:800;color:#637889;display:block;margin-bottom:5px}
.chrono-event-dialog .chrono-detail-title{font-size:17px;line-height:1.3;font-weight:800;margin:0 25px 10px 0;color:#183f6e}
.chrono-event-dialog .chrono-detail-body{font-size:13px;color:#304c61;margin:0;line-height:1.65;white-space:pre-line}
.chrono-event-dialog .chrono-detail-note{font-size:10px;color:#687b85;border-top:1px solid #e2eaf0;padding-top:9px;margin:13px 0 0}
.chrono-event-dialog .chrono-detail-close{position:absolute;top:10px;right:10px;display:grid;place-items:center;cursor:pointer;width:32px;height:32px;font-size:24px;line-height:1;border-radius:8px;color:#56728b;background:#eff5fa;border:1px solid #e0e8ef}
.chrono-event-dialog .chrono-detail-close:hover,.chrono-event-dialog .chrono-detail-close:focus-visible{background:#dbeaf6;outline:2px solid #3980b9}
.timeline-interaction-hint{font-size:11.5px!important;color:#3b698e!important;font-weight:700}
@keyframes chrono-popup-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:650px){.chrono-event-dialog{right:10px;bottom:10px;width:calc(100vw - 20px);max-height:47vh;padding:14px 16px}}
@media(prefers-reduced-motion:reduce){.timeline-board article,.timeline-board .email-time,.chrono-event-dialog{transition:none!important;animation:none!important}}
@media print{.chrono-event-dialog,.timeline-interaction-hint{display:none!important}.timeline-board article{box-shadow:none!important;transform:none!important}}