:root{--vtp-bg: #0d1117;--vtp-panel: #161b22;--vtp-border: #30363d;--vtp-text: #c9d1d9;--vtp-muted: #8b949e;--vtp-accent: #58a6ff;--vtp-accent-hover: #3182ce;--vtp-danger: #f85149;--vtp-font: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}.vtp-page-wrapper *{box-sizing:border-box;margin:0;padding:0}.vtp-page-wrapper{font-family:var(--vtp-font);background-color:var(--vtp-bg);color:var(--vtp-text);min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:4rem 60px;gap:3rem;width:100%}.vtp-container{background-color:var(--vtp-panel);border:1px solid var(--vtp-border);border-radius:12px;width:100%;max-width:900px;padding:2.5rem;box-shadow:0 10px 30px #00000080;display:flex;flex-direction:column;gap:1.5rem;position:relative;animation:vtpFadeIn .5s ease-out}.vtp-header{text-align:center;margin-bottom:1rem}.vtp-header h1{font-size:2.1rem;font-weight:700;color:#fff;margin-bottom:.6rem}.vtp-header p{color:var(--vtp-muted);font-size:1.05rem}.vtp-dropzone{border:2px dashed var(--vtp-border);border-radius:12px;padding:4rem 2rem;text-align:center;cursor:pointer;transition:all .25s ease;display:flex;flex-direction:column;align-items:center;gap:1.2rem}.vtp-dropzone:hover{border-color:var(--vtp-accent-hover);background-color:#ffffff05}.vtp-dropzone.active{border-color:var(--vtp-accent);background-color:#58a6ff14}.vtp-dropzone-icon{color:var(--vtp-accent);width:52px;height:52px}.vtp-hint{color:var(--vtp-muted);font-size:.88rem}.vtp-workspace{display:flex;flex-direction:column;gap:1.5rem}.vtp-video-wrapper{position:relative;border-radius:10px;overflow:hidden;background:#000;border:1px solid var(--vtp-border)}.vtp-video{width:100%;display:block;max-height:480px;object-fit:contain;background:#000}.vtp-flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;transition:opacity .05s ease;z-index:10}.vtp-flash.active{opacity:.35}.vtp-controls{display:flex;align-items:center;gap:1rem}.vtp-btn-capture{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.75rem;background-color:var(--vtp-accent);color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:background-color .2s ease,transform .1s ease;font-family:var(--vtp-font)}.vtp-btn-capture:hover{background-color:var(--vtp-accent-hover);transform:translateY(-1px)}.vtp-btn-capture:active{transform:scale(.97)}.vtp-btn-ghost{display:inline-flex;align-items:center;gap:.4rem;padding:.65rem 1.1rem;background-color:transparent;border:1px solid var(--vtp-border);color:var(--vtp-muted);border-radius:8px;font-size:.9rem;cursor:pointer;transition:all .2s ease;font-family:var(--vtp-font)}.vtp-btn-ghost:hover{border-color:var(--vtp-muted);color:var(--vtp-text);background-color:#ffffff0a}.vtp-btn-ghost.small{padding:.4rem .8rem;font-size:.82rem}.vtp-frames-section{display:flex;flex-direction:column;gap:1rem;border-top:1px solid var(--vtp-border);padding-top:1.5rem}.vtp-frames-header{display:flex;align-items:center;justify-content:space-between}.vtp-frames-title{font-size:1rem;font-weight:600;color:var(--vtp-text)}.vtp-badge{background-color:var(--vtp-accent);color:#fff;font-size:.75rem;font-weight:700;padding:.15rem .5rem;border-radius:999px;line-height:1.4}.vtp-empty{padding:2.5rem 1rem;text-align:center;color:var(--vtp-muted);font-size:.95rem;border:1px dashed var(--vtp-border);border-radius:8px}.vtp-frames-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:1rem}.vtp-frame-card{position:relative;border-radius:8px;overflow:hidden;border:1px solid var(--vtp-border);background:#000;aspect-ratio:16 / 9;transition:border-color .2s ease,transform .2s ease}.vtp-frame-card:hover{border-color:var(--vtp-accent);transform:translateY(-3px)}.vtp-frame-img{width:100%;height:100%;object-fit:cover;display:block}.vtp-frame-timestamp{position:absolute;bottom:.4rem;left:.4rem;background:#000000b8;color:#fff;font-size:.72rem;font-weight:600;padding:.15rem .45rem;border-radius:4px}.vtp-frame-overlay{position:absolute;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;gap:.6rem;opacity:0;transition:opacity .2s ease}.vtp-frame-card:hover .vtp-frame-overlay{opacity:1}.vtp-btn-icon{width:36px;height:36px;border-radius:50%;border:none;background:var(--vtp-accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s ease,background-color .15s ease}.vtp-btn-icon:hover{transform:scale(1.1);background-color:var(--vtp-accent-hover)}.vtp-btn-icon.danger{background:var(--vtp-danger)}.vtp-btn-icon.danger:hover{background:#e5534b}@keyframes vtpFadeIn{0%{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.vtp-page-wrapper{padding:2rem 16px}.vtp-container{padding:1.5rem}.vtp-header h1{font-size:1.6rem}.vtp-frames-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.vtp-controls{flex-wrap:wrap}}