.pr-page{overflow-x:clip}.pr-stage{margin-top:64px}.pr-flow{margin-top:clamp(72px,8vw,120px)}.pr-demo{--pr-move:cubic-bezier(.77, 0, .175, 1);--pr-arrive:cubic-bezier(.23, 1, .32, 1)}.pr-demo .pub-app__canvas{min-height:560px;overflow:hidden}.pr-art{aspect-ratio:1;width:min(100%,460px);position:relative;overflow:clip}.pr-layer{width:100%;height:100%;display:block;position:absolute;inset:0}.pr-orig{clip-path:inset(0 100% 0 0)}.pr-demo[data-phase=problem] .pr-orig{clip-path:inset(0)}.pr-demo[data-phase=work] .pr-orig{clip-path:inset(0 0 0 100%)}.pr-demo[data-phase=split] .pr-orig{clip-path:inset(0 50% 0 0)}.pr-sample{opacity:0;pointer-events:none}.pr-sample rect{fill:none;stroke:#fff;stroke-width:2px;stroke-dasharray:7 6}.pr-scan,.pr-divider{opacity:0;pointer-events:none;position:absolute;inset:0}.pr-scan>i{background:#fff;width:2px;margin-left:-1px;position:absolute;top:0;bottom:0;left:0;box-shadow:0 0 0 1px #0b0f1440}.pr-scan:before{content:"";background:linear-gradient(90deg,#fff0,#ffffff61);width:16%;position:absolute;top:0;bottom:0;left:-16%}.pr-divider{transform:translate(0)}.pr-divider:before{content:"";background:#fff;width:2px;margin-left:-1px;position:absolute;top:0;bottom:0;left:0;box-shadow:0 0 0 1px #0b0f141f}.pr-divider>i{background:#fff;border-radius:50%;width:22px;height:22px;margin:-11px 0 0 -11px;position:absolute;top:50%;left:0;box-shadow:0 0 0 1px #0b0f1440}.pr-demo[data-phase=split] .pr-divider{opacity:1;transform:translate(50%)}.pr-badge{color:#fff;background:#0b0f14cc;border-radius:4px;padding:4px 10px;font-size:12px;font-weight:600;position:absolute;top:14px;left:14px}.pr-panelwrap{flex-direction:column;gap:12px;display:flex}.pr-bar{background:var(--endorr-paper);border-radius:2px;height:4px;overflow:hidden}.pr-bar>span{background:var(--endorr-black);transform-origin:0;border-radius:2px;height:100%;display:block}.pr-demo .pub-primary{transition:transform .16s ease-out}.pr-demo .pub-primary[data-pressed=true]{transform:scale(.97)}.pr-demo[data-live=true][data-phase=work] .pr-sample{animation:.9s ease-in-out both pr-sample}.pr-demo[data-live=true][data-phase=work] .pr-sample rect{animation:.5s linear infinite pr-march}.pr-demo[data-live=true][data-phase=work] .pr-orig{animation:2.3s linear .7s both pr-wipe}.pr-demo[data-live=true][data-phase=work] .pr-scan{animation:2.3s linear .7s forwards pr-scan}.pr-demo[data-live=true][data-phase=work] .pr-bar>span{animation:3s linear both pr-bar}.pr-demo[data-live=true][data-phase=split] .pr-orig{animation:pr-split-in 1.2s var(--pr-move) both}.pr-demo[data-live=true][data-phase=split] .pr-divider{animation:pr-divider-in 1.2s var(--pr-move) both}.pr-demo[data-live=true][data-phase=ready] .pr-orig{animation:pr-split-out 1s var(--pr-move) both}.pr-demo[data-live=true][data-phase=ready] .pr-divider{animation:pr-divider-out 1s var(--pr-move) both}.pr-demo[data-live=true]:not([data-phase=problem]) .pr-state{animation:pr-rise .4s var(--pr-arrive) both}.pr-demo[data-live=true][data-phase=split] .pr-badge,.pr-demo[data-live=true][data-phase=ready] .pr-badge{animation:pr-rise .3s var(--pr-arrive) both}.pr-demo[data-playing=false] *{animation-play-state:paused!important}@keyframes pr-march{to{stroke-dashoffset:-13px}}@keyframes pr-sample{0%{opacity:0}25%{opacity:1}80%{opacity:1}to{opacity:0}}@keyframes pr-wipe{0%{clip-path:inset(0)}to{clip-path:inset(0 0 0 100%)}}@keyframes pr-scan{0%{opacity:1;transform:translate(0)}94%{opacity:1}to{opacity:0;transform:translate(100%)}}@keyframes pr-bar{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes pr-split-in{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 50% 0 0)}}@keyframes pr-split-out{0%{clip-path:inset(0 50% 0 0)}to{clip-path:inset(0 100% 0 0)}}@keyframes pr-divider-in{0%{opacity:0;transform:translate(0)}20%{opacity:1}to{opacity:1;transform:translate(50%)}}@keyframes pr-divider-out{0%{opacity:1;transform:translate(50%)}80%{opacity:1}to{opacity:0;transform:translate(0)}}@keyframes pr-rise{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.pr-toggle-row{justify-content:space-between;align-items:center;display:flex}.pr-toggle{background:var(--endorr-black);border-radius:10px;width:34px;height:20px;position:relative}.pr-toggle:after{content:"";background:#fff;border-radius:50%;width:16px;height:16px;position:absolute;top:2px;right:2px}.pr-applied{justify-content:space-between;gap:12px;display:flex}.pr-applied u{color:var(--app-text-2)}.pr-regions{flex-direction:column;gap:6px;margin:0;padding:0;font-size:13px;list-style:none;display:flex}.pr-regions li{border:1px solid var(--app-line,#e8eaed);border-radius:8px;justify-content:space-between;align-items:center;gap:10px;padding:6px 10px;display:flex}.pr-regions em{background:var(--endorr-paper);border-radius:4px;padding:2px 8px;font-size:11px;font-style:normal;font-weight:600}.pr-regions em[data-state=kept]{background:var(--status-ok-tint);color:#1a6b32}.pr-file{align-items:center;gap:12px;display:flex}.pr-file svg{border-radius:6px;flex:none;width:64px;height:64px}.pr-file b{font-weight:600}@media (max-width:1000px){.pr-demo .pub-app__canvas{min-height:0;padding:16px}}@media (max-width:560px){.pr-demo .pub-steps{display:none}}@media (prefers-reduced-motion:reduce){.pr-demo *,.pr-demo :before{transition:none!important;animation:none!important}}
