/* Solo esta página: explorador de etapas, línea de sprints y figuras en código (prefijo pr-) */
.pr-x{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:40px;align-items:start}
.pr-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);position:sticky;top:96px}
.pr-list button{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:grid;grid-template-columns:44px 1fr;gap:4px 8px;padding:22px 0;border-bottom:1px solid var(--line);position:relative}
.pr-list button::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--green)}
.pr-list button.on::after{width:100%;transition:width var(--pr-d,6s) linear}
.pr-list .k{font:500 12px/1.9 var(--f-mono);color:var(--fg-3)}
.pr-list b{font:500 22px/1.25 var(--f-display);letter-spacing:-.025em;color:var(--fg-3);transition:color .3s}
.pr-list small{grid-column:2;display:none;color:var(--fg-2);font-size:15px;max-width:340px;padding-top:6px}
.pr-list button.on .k{color:var(--green-text)}
.pr-list button.on b,.pr-list button:hover b{color:var(--fg-hi)}
.pr-list button.on small{display:block}
.pr-list button:focus-visible{outline:2px solid var(--green);outline-offset:4px;border-radius:4px}
.pr-panels{position:relative}
.pr-panel{display:none}
.pr-panel.on{display:block;animation:prIn .6s var(--ease) both}
@keyframes prIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.pr-stage{position:relative;z-index:1;padding:32px 32px 24px;border-bottom:1px solid var(--line);background-image:radial-gradient(circle,var(--dot) 1px,transparent 1.2px);background-size:22px 22px}
.pr-body{position:relative;z-index:1;padding:22px 32px 26px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.pr-body .pr-h{display:none}
.pr-svg{width:100%;height:auto;overflow:visible;display:block}
.pr-svg text{font:500 12.5px var(--f-body);fill:var(--fg);letter-spacing:-.005em}
.pr-svg text.m{font:500 10px var(--f-mono);letter-spacing:.07em;fill:var(--fg-3);text-transform:uppercase}
.pr-svg text.gt{fill:var(--green-text)}
.pr-svg text.hi{fill:var(--fg-hi)}
.pr-svg text.big{font:500 26px var(--f-display);letter-spacing:-.03em;fill:var(--fg-hi)}
.pr-svg .ln{stroke:var(--line-2);stroke-width:1;fill:none}
.pr-svg .dl{stroke:var(--line-3);stroke-width:1;stroke-dasharray:3 4;fill:none}
.pr-svg .gl{stroke:var(--green);stroke-width:1.5;fill:none}
.pr-svg .tk{fill:var(--bg-2);stroke:var(--line-2);stroke-width:1}
.pr-svg .tk.hi{fill:var(--bg-3)}
.pr-svg .tk.ok{stroke:var(--green-line);fill:var(--green-tint)}
.pr-svg .ck{fill:none;stroke:var(--green);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pr-svg .bar{fill:var(--line-2)}
.pr-svg .barf{fill:var(--fg-3)}
.pr-svg .barg{fill:var(--green)}
.pr-svg .dot{fill:var(--fg-3)}
.pr-svg .dotg{fill:var(--green)}
.pr-svg .area{fill:var(--green-tint)}
.pr-svg .draw{stroke-dasharray:100;stroke-dashoffset:100}
.pr-panel.on .pr-svg .draw{animation:prDraw 1.4s .2s var(--ease) forwards}
@keyframes prDraw{to{stroke-dashoffset:0}}
.pr-sprints{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line-2)}
.pr-sprints li{position:relative;padding:40px 28px 0 0;display:flex;flex-direction:column}
.pr-sprints li::before{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line-3)}
.pr-sprints li.pr-last::before{background:var(--green);box-shadow:0 0 0 4px var(--green-tint)}
.pr-sprints h3{font:500 clamp(20px,1.8vw,24px)/1.15 var(--f-display);letter-spacing:-.03em;color:var(--fg-hi);margin:18px 0 12px}
.pr-sprints p{margin:0 0 24px;color:var(--fg-2);font-size:15px;max-width:250px}
.pr-del{margin-top:auto;min-height:92px;display:flex;flex-direction:column;gap:8px;padding:16px 18px;border-radius:var(--r-in);background:var(--bg-1);box-shadow:inset 0 0 0 1px var(--line-2);font:500 15px/1.3 var(--f-display);letter-spacing:-.01em;color:var(--fg-hi)}
.pr-del svg{flex:none;width:14px;height:14px;fill:none;stroke:var(--green);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pr-del small{display:flex;align-items:center;gap:8px;font:500 10px/1 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3)}
.pr-last .pr-del{box-shadow:inset 0 0 0 1px var(--green-line);background:var(--green-tint)}
.pr-q{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;margin-top:72px;background:var(--line);border-radius:var(--r-card);overflow:hidden;box-shadow:inset 0 0 0 1px var(--line)}
.pr-q div{background:var(--bg);padding:24px 22px;display:flex;flex-direction:column;gap:10px}
.pr-q b{font:500 18px/1.25 var(--f-display);letter-spacing:-.02em;color:var(--fg-hi)}
@media (max-width:960px){
  .pr-x{grid-template-columns:minmax(0,1fr)}
  .pr-panels{min-width:0}
  .pr-body{flex-direction:column;align-items:flex-start;gap:8px}
  .pr-body .mono:not(:last-child){display:none}
  .pr-list{display:none}
  .pr-panel{display:block;margin-bottom:16px}
  .pr-svg .draw{stroke-dashoffset:0}
  .pr-body .pr-h{display:block;font:500 20px/1.25 var(--f-display);letter-spacing:-.025em;color:var(--fg-hi);margin:0}
  .pr-sprints{grid-template-columns:1fr 1fr;row-gap:48px}
  .pr-q{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .pr-stage{padding:20px 14px 16px;overflow-x:auto;scrollbar-width:none}.pr-stage::-webkit-scrollbar{display:none}.pr-body{padding:20px}
  .pr-svg{min-width:440px}
  .pr-sprints{grid-template-columns:1fr;border-top:0;border-left:1px solid var(--line-2);row-gap:40px;margin-left:4px}
  .pr-sprints li{padding:0 0 0 28px}
  .pr-sprints li::before{top:2px;left:-5px}
  .pr-sprints h3{margin-top:12px}
  .pr-q{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.pr-panel.on{animation:none}.pr-svg .draw{stroke-dashoffset:0}.pr-panel.on .pr-svg .draw{animation:none}}