.pj-viewer{background:var(--pj-bg-deep);border-bottom:1px solid var(--pj-line)}.pj-viewer-stage{width:100%;height:min(44vh,400px);position:relative;overflow:hidden}@media (width<=720px){.pj-viewer-stage{height:min(32vh,240px)}}.pj-slide{width:100%;height:100%}.pj-slide[hidden]{display:none}.pj-slide img,.pj-viewer-stage>img{object-fit:contain;width:100%;height:100%;display:block}.pj-viewer-nav{border-radius:var(--pj-r-md);background:color-mix(in srgb, var(--pj-surface) 92%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--pj-line);width:34px;height:34px;color:var(--pj-ink);cursor:pointer;opacity:0;transition:opacity var(--pj-base) var(--pj-ease), border-color var(--pj-fast) var(--pj-ease), color var(--pj-fast) var(--pj-ease);justify-content:center;align-items:center;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.pj-viewer-nav svg{width:14px;height:14px}.pj-viewer-prev{left:12px}.pj-viewer-next{right:12px}.pj-viewer-stage:hover .pj-viewer-nav,.pj-viewer-nav:focus-visible{opacity:1}.pj-viewer-nav:hover{border-color:var(--pj-link);color:var(--pj-link)}@media (hover:none){.pj-viewer-nav{opacity:1}}.pj-viewer-counter{background:color-mix(in srgb, var(--pj-surface) 92%, transparent);border:1px solid var(--pj-line);color:var(--pj-ink-2);font-family:var(--pj-font-mono);border-radius:var(--pj-r-sm);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:2px 7px;font-size:10.5px;position:absolute;bottom:11px;right:11px}.pj-viewer-caption{color:var(--pj-ink-3);font-size:12.5px;line-height:1.55;font-family:var(--pj-font-mono);background:var(--pj-bg-sunk);border-top:1px solid var(--pj-line-soft);padding:10px 30px}@media (width<=720px){.pj-viewer-caption{padding:9px 18px}}.pj-demo .pj-viewer-caption{text-align:center;background:0 0;border-top:none;max-width:62ch;margin:0 auto;padding:13px 16px 0}.pj-viewer-demo{background:radial-gradient(120% 90% at 50% 0%, color-mix(in srgb, var(--pj-bg-sunk) 70%, transparent), transparent 70%), var(--pj-bg-deep);padding:34px 34px 30px}@media (width<=720px){.pj-viewer-demo{padding:16px 16px 14px}}.pj-demo{max-width:760px;margin:0 auto}.pj-demo-frame{width:calc(var(--demo-w,1440) * var(--demo-scale,.5) * 1px);border:1px solid var(--pj-line);border-radius:var(--pj-r-lg);background:var(--pj-surface);max-width:100%;box-shadow:0 1px 2px rgb(var(--gb-shadow) / .06), 0 18px 44px -22px rgb(var(--gb-shadow) / .38);margin:0 auto;overflow:hidden}.pj-demo-chrome{background:var(--pj-bg-sunk);border-bottom:1px solid var(--pj-line);height:30px;font-family:var(--pj-font-mono);color:var(--pj-ink-3);align-items:center;gap:10px;padding:0 8px 0 11px;font-size:10.5px;display:flex}.pj-demo-dots{flex-shrink:0;gap:5px;display:flex}.pj-demo-dots i{background:var(--pj-line);border-radius:50%;width:7px;height:7px}.pj-demo-url{white-space:nowrap;text-overflow:ellipsis;letter-spacing:.02em;flex:1;overflow:hidden}.pj-demo-live{color:var(--pj-ok);text-transform:uppercase;letter-spacing:.11em;border:1px solid color-mix(in srgb, var(--pj-ok) 40%, transparent);border-radius:999px;flex-shrink:0;padding:1px 6px;font-size:9px}.pj-demo-video{color:var(--pj-highlight);border-color:color-mix(in srgb, var(--pj-highlight) 40%, transparent)}.pj-demo-zoom{border-radius:var(--pj-r-sm);width:22px;height:22px;color:var(--pj-ink-3);cursor:pointer;transition:color var(--pj-fast) var(--pj-ease), border-color var(--pj-fast) var(--pj-ease), background var(--pj-fast) var(--pj-ease);background:0 0;border:1px solid #0000;flex-shrink:0;justify-content:center;align-items:center;display:flex}.pj-demo-zoom svg{width:12px;height:12px}.pj-demo-zoom:hover{color:var(--pj-link);border-color:color-mix(in srgb, var(--pj-link) 40%, transparent);background:var(--pj-link-wash)}.pj-demo-stage{width:100%;height:calc(var(--demo-h,900) * var(--demo-scale,.5) * 1px);background:var(--pj-bg-deep);position:relative;overflow:hidden}.pj-demo-stage-video{aspect-ratio:16/9;height:auto}.pj-demo-surface{width:calc(var(--demo-w,1440) * 1px);height:calc(var(--demo-h,900) * 1px);transform:scale(var(--demo-scale,.45));transform-origin:0 0;position:absolute;top:0;left:0}.pj-demo-surface iframe{background:var(--pj-bg-deep);border:0;width:100%;height:100%;display:block}.pj-demo-poster{object-fit:cover;width:100%;height:100%;display:block}.pj-video{object-fit:contain;background:#000;width:100%;height:100%;display:block}.pj-demo-play{background:color-mix(in srgb, var(--gb-bg0) 52%, transparent);cursor:pointer;color:var(--pj-ink);font-family:var(--pj-font-mono);letter-spacing:.03em;-webkit-backdrop-filter:blur(1.5px);backdrop-filter:blur(1.5px);transition:background var(--pj-base) var(--pj-ease);border:none;flex-direction:column;justify-content:center;align-items:center;gap:12px;font-size:12px;display:flex;position:absolute;inset:0}.pj-demo-play:hover{background:color-mix(in srgb, var(--gb-bg0) 34%, transparent)}.pj-demo-play-icon{background:var(--pj-surface);width:46px;height:46px;color:var(--pj-link);border:1px solid color-mix(in srgb, var(--pj-link) 30%, transparent);box-shadow:0 4px 14px -4px rgb(var(--gb-shadow) / .3);transition:transform var(--pj-base) var(--pj-ease-soft), background var(--pj-base) var(--pj-ease), color var(--pj-base) var(--pj-ease);border-radius:50%;justify-content:center;align-items:center;display:flex}.pj-demo-play-icon svg{width:15px;height:15px;margin-left:2px}.pj-demo-play:hover .pj-demo-play-icon{background:var(--pj-link);color:var(--pj-surface);transform:scale(1.07)}.pj-demo-play-label{opacity:.9}.pj-modal-inner:has(.pj-demo-full){clip-path:none!important;transform:none!important}.pj-demo-exit{z-index:2;border:1px solid var(--pj-line);background:color-mix(in srgb, var(--pj-surface) 94%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--pj-ink-2);cursor:pointer;font-family:var(--pj-font-mono);box-shadow:var(--pj-shadow-hover);transition:color var(--pj-fast) var(--pj-ease), border-color var(--pj-fast) var(--pj-ease);border-radius:999px;align-items:center;gap:8px;padding:8px 14px;font-size:11.5px;display:none;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.pj-demo-exit svg{width:11px;height:11px}.pj-demo-exit kbd{border:1px solid var(--pj-line);color:var(--pj-ink-3);border-radius:3px;padding:0 4px;font-family:inherit;font-size:10px}.pj-demo-exit:hover{color:var(--pj-danger);border-color:color-mix(in srgb, var(--pj-danger) 45%, transparent)}.pj-demo.pj-demo-full{z-index:1;background:color-mix(in srgb, var(--gb-bg0) 94%, transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);max-width:none;animation:pj-demo-in .32s var(--pj-ease-soft) both;flex-direction:column;justify-content:center;align-items:center;margin:0;padding:34px 34px 70px;display:flex;position:fixed;inset:0}@keyframes pj-demo-in{0%{opacity:0}to{opacity:1}}.pj-demo.pj-demo-full .pj-demo-frame{animation:pj-demo-frame-in .38s var(--pj-ease-soft) both}@keyframes pj-demo-frame-in{0%{opacity:.4;transform:scale(.94)}to{opacity:1;transform:scale(1)}}.pj-demo.pj-demo-full .pj-viewer-caption{display:none}.pj-demo.pj-demo-full .pj-demo-exit{display:inline-flex}.pj-demo.pj-demo-closing{animation:pj-demo-in .2s var(--pj-ease) reverse both}@media (prefers-reduced-motion:reduce){.pj-demo.pj-demo-full,.pj-demo.pj-demo-full .pj-demo-frame,.pj-demo.pj-demo-closing{animation:none}}