.pp{position:relative;max-width:760px;margin:0 auto 44px;text-align:left;padding:22px 22px 20px;border-radius:var(--r);
  background:linear-gradient(180deg,rgba(17,22,26,.92),rgba(8,11,13,.92));box-shadow:0 0 0 1px var(--line2) inset,0 30px 80px -40px rgba(80,254,182,.35)}
.final .pp .pp-k{display:flex;max-width:none;align-items:center;gap:10px;margin:0 0 10px;font:600 11px/1.2 var(--fm);letter-spacing:.14em;text-transform:uppercase;color:var(--mint)}
.pp-dot{width:8px;height:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 0 rgba(80,254,182,.5)}
.pp.is-vis .pp-dot{animation:ppPulse 2.4s ease-out infinite}
@keyframes ppPulse{0%{box-shadow:0 0 0 0 rgba(80,254,182,.55)}70%{box-shadow:0 0 0 10px rgba(80,254,182,0)}100%{box-shadow:0 0 0 0 rgba(80,254,182,0)}}
.final .pp-h{font:400 clamp(20px,2.4vw,28px)/1.15 var(--fd);text-transform:uppercase;margin:0 0 8px;color:var(--tx)}
.final .pp p.pp-p{font-size:15.5px;line-height:1.5;color:var(--tx2);margin:0 0 6px;max-width:none}
.final .pp p.pp-side{font:600 13px/1.4 var(--fm);color:var(--lime);margin:0 0 14px;max-width:none;min-height:1.4em}
.pp-stage{position:relative;border-radius:14px;background:#05080A;box-shadow:0 0 0 1px var(--line) inset;overflow:hidden}
.pp-cv{display:block;width:100%;height:280px;cursor:crosshair;touch-action:pan-y;outline:none}
.pp-cv:focus-visible{box-shadow:0 0 0 2px var(--mint) inset}
.pp-grip{position:absolute;right:52px;top:0;width:44px;height:44px;padding:0;border:0;background:transparent;cursor:ns-resize;touch-action:none;
  display:flex;align-items:center;justify-content:center;will-change:transform}
.pp-grip::before{content:"";width:30px;height:30px;border-radius:50%;background:var(--loss);box-shadow:0 0 0 4px rgba(255,92,108,.22),0 6px 18px -4px rgba(255,92,108,.7)}
.pp-grip::after{content:"";position:absolute;width:12px;height:10px;border-top:2px solid #fff;border-bottom:2px solid #fff;box-sizing:border-box}
.pp-grip.is-ghost::before{background:rgba(255,92,108,.35)}
.pp.is-vis .pp-grip.is-ghost::before{animation:ppGrip 1.8s ease-in-out infinite}
@keyframes ppGrip{50%{transform:scale(1.18)}}
.pp-grip:focus-visible{outline:2px solid var(--mint);outline-offset:-4px;border-radius:12px}
.pp-grip[hidden]{display:none}
.pp-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:14px;flex-wrap:wrap}
.final .pp p.pp-hint{flex:1 1 260px;font:500 13px/1.45 var(--fb);color:var(--tx2);margin:0;max-width:none;min-height:2.9em}
.pp-go[disabled]{opacity:.45;cursor:not-allowed;filter:saturate(.5)}
.pp.is-playing .pp-go{opacity:.45}
.pp-res{margin-top:18px;display:grid;grid-template-columns:auto 1fr;gap:6px 22px;align-items:start;padding-top:18px;border-top:1px solid var(--line)}
.pp-res[hidden]{display:none}
.pp-mark{grid-column:1;grid-row:1 / span 5;width:84px;height:62px;overflow:visible;margin-top:4px}
.pp-res > p{grid-column:2}
.pp.is-done .pp-bar{display:none}
.pp-mark rect{fill:none;stroke:rgba(255,255,255,.22);stroke-width:1.4}
.pp-mark .w{stroke:rgba(255,255,255,.22);stroke-width:1.4}
.pp-mark .f{fill:url(#ppg);stroke:none;transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0)}
.pp-mark.lit .f{animation:ppLit 1.4s .2s var(--ease) forwards}
html.rm .pp-mark.lit .f{animation:none;transform:scaleY(1)}
@keyframes ppLit{to{transform:scaleY(1)}}
.final .pp .pp-res-h{font:400 clamp(18px,2vw,24px)/1.2 var(--fd);text-transform:uppercase;margin:0;max-width:none;color:var(--tx)}
.pp.is-hit .pp-res-h{color:#FFB3BA}
.pp.is-ok .pp-res-h{color:var(--lime)}
.final .pp .pp-res-p{font-size:15.5px;line-height:1.5;color:var(--tx);margin:0;max-width:none}
.final .pp .pp-res-s,.final .pp .pp-res-d{font:500 12px/1.5 var(--fm);color:var(--tx2);margin:0;max-width:none}
.final .pp .pp-candle{font:600 12px/1.5 var(--fm);color:var(--mint);margin:2px 0 0;max-width:none}
.pp-res-acts{grid-column:1 / -1;display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}
.final .pp .pp-note{grid-column:1 / -1;font:500 11.5px/1.5 var(--fm);color:var(--tx3);margin:8px 0 0;max-width:none}
@media (max-width:640px){
  .pp{padding:16px 14px 16px;margin-bottom:34px}
  .pp-res{grid-template-columns:1fr}
  .pp-mark{grid-row:auto;width:70px;height:52px}
  .pp-res > p{grid-column:1}
  .pp-res-acts .btn{width:100%}
  .pp-bar .pp-go{width:100%}
}