.wt-scope{--ink:#111827;--body:#1f2937;--muted:#6b7280;--faint:#8a93a3;--card:#fff;--panel:#f7fafc;--border:#e5e9f2;--border-strong:#d4ddea;--brand:#007be9;--brand-ink:#0a5fae;--brand-2:#2eb7d3;--brand-2-ink:#0f7790;--grad-from:#00bfe3;--grad-to:#1f879f;--success:#10b981;--danger:#ef4444;--warn:#d97706;--shadow-sm:0 8px 30px #1f29370f;--shadow-md:0 16px 40px #007be91f;--shadow-lg:0 22px 50px #007be929;--studio-bg:#0b1220;--video-bg:#0f172a;color:var(--body);-webkit-font-smoothing:antialiased;background:radial-gradient(56rem 26rem at 50% -10rem,#2eb7d312,#0000 70%),linear-gradient(#fff 0%,#fbfdfe 42%,#f4f9fb 100%);min-height:100vh;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}.wt-scope *,.wt-scope :before,.wt-scope :after{box-sizing:border-box}.wt-scope .shell,.wt-scope .setup-shell{flex-direction:column;width:min(960px,100% - 40px);margin:0 auto;padding:56px 0 88px;display:flex}.wt-scope .shell>*+*,.wt-scope .setup-shell>*+*{margin-top:64px}.wt-scope .shell>.work-card{margin-top:40px}.wt-scope .page-header{text-align:center;padding:4px 0 0}.wt-scope .page-header h1{letter-spacing:-.02em;color:var(--ink);margin:0;font-size:clamp(34px,5.4vw,56px);font-weight:900;line-height:1.08}.wt-scope .lead{max-width:640px;color:var(--muted);margin:18px auto 0;font-size:clamp(15px,1.5vw,18px);font-weight:400;line-height:1.7}.wt-scope .hero-points{text-align:left;flex-direction:column;gap:12px;max-width:520px;margin:26px auto 0;padding:0;list-style:none;display:flex}.wt-scope .hero-points li{color:var(--body);align-items:center;gap:12px;font-size:15px;font-weight:600;display:flex}.wt-scope .hero-points .check{width:24px;height:24px;color:var(--success);background:#10b9811f;border-radius:50%;flex-shrink:0;place-items:center;display:grid}.wt-scope .hero-points .check svg{stroke:currentColor;fill:none;stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round;width:14px;height:14px}.wt-scope .hero-note{max-width:620px;color:var(--faint);margin:20px auto 0;font-size:14px;line-height:1.6}.wt-scope .work-card,.wt-scope .setup-card{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:24px}.wt-scope .work-card{flex-direction:column;gap:22px;padding:28px;display:flex}.wt-scope .work-card-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;display:flex}.wt-scope .work-card-head h2{letter-spacing:-.01em;color:var(--ink);margin:0;font-size:19px;font-weight:800}.wt-scope .status{color:var(--muted);align-items:center;gap:9px;font-size:13px;font-weight:700;display:flex}.wt-scope .dot{background:#cbd5e1;border-radius:50%;flex-shrink:0;width:9px;height:9px;box-shadow:0 0 0 5px #cbd5e138}.wt-scope .dot.live{background:var(--success);box-shadow:0 0 0 5px #10b9812e}.wt-scope .dot.busy{background:var(--brand);animation:1.2s ease-in-out infinite wtPulse;box-shadow:0 0 0 5px #007be92e}@keyframes wtPulse{0%,to{opacity:1}50%{opacity:.45}}.wt-scope .stage{background:var(--video-bg);border-radius:18px;min-height:360px;position:relative;overflow:hidden}.wt-scope video{object-fit:contain;background:var(--video-bg);width:100%;min-height:360px;max-height:56vh;display:block}.wt-scope video.mirrored{transform:scaleX(-1)}.wt-scope .placeholder{color:#cbd5e1;text-align:center;pointer-events:none;place-items:center;padding:32px;display:grid;position:absolute;inset:0}.wt-scope .placeholder strong{color:#e2e8f0;margin-bottom:8px;font-size:16px;display:block}.wt-scope .placeholder p{color:#94a3b8;margin:0;font-size:14px}.wt-scope .recording-badge{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);letter-spacing:.06em;pointer-events:none;z-index:3;background:#0f172abd;border-radius:999px;align-items:center;gap:9px;padding:8px 13px;font-size:12px;font-weight:800;display:none;position:absolute;top:14px;left:14px}.wt-scope .recording-badge.active{display:inline-flex}.wt-scope .recording-dot{background:var(--danger);border-radius:50%;width:8px;height:8px;animation:1.2s ease-in-out infinite wtRecPulse}@keyframes wtRecPulse{0%,to{opacity:1;box-shadow:0 0 #ef44448c}50%{opacity:.45;box-shadow:0 0 0 7px #ef444400}}.wt-scope .metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.wt-scope .metric{border:1px solid var(--border);background:var(--panel);border-radius:16px;padding:16px}.wt-scope .metric span{color:var(--muted);text-transform:uppercase;letter-spacing:.07em;font-size:11px;font-weight:800;display:block}.wt-scope .metric strong{color:var(--ink);word-break:break-word;margin-top:6px;font-size:18px;font-weight:800;display:block}.wt-scope .work-controls{flex-direction:column;gap:16px;display:flex}.wt-scope .controls{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.wt-scope button,.wt-scope a.download{appearance:none;font:inherit;letter-spacing:.01em;cursor:pointer;will-change:transform;border:0;border-radius:999px;padding:12px 26px;font-size:15px;font-weight:700;line-height:1.1;text-decoration:none;transition:transform .3s,box-shadow .3s,background .3s,color .2s,border-color .2s,opacity .2s}.wt-scope button:disabled{cursor:not-allowed;opacity:.5;box-shadow:none!important;transform:none!important}.wt-scope .primary,.wt-scope .secondary,.wt-scope .danger,.wt-scope a.download{border-radius:999px;padding:12px 26px}.wt-scope .primary:hover:not(:disabled),.wt-scope .secondary:hover:not(:disabled),.wt-scope .danger:hover:not(:disabled),.wt-scope a.download:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.wt-scope .primary{color:#fff;background:linear-gradient(180deg, var(--grad-from), var(--grad-to));box-shadow:0 8px 22px #1f879f3d}.wt-scope .secondary,.wt-scope a.download{color:var(--brand-2-ink);border:1px solid var(--brand-2);background:#fff}.wt-scope .secondary:hover:not(:disabled),.wt-scope a.download:hover{border-color:var(--brand-2);background:#fff}.wt-scope .danger{color:#fff;background:var(--danger);box-shadow:0 8px 22px #ef444438}.wt-scope .note{color:var(--faint);text-align:center;margin:0;font-size:13px;line-height:1.6}.wt-scope label{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;margin-bottom:8px;font-size:12px;font-weight:800;display:block}.wt-scope select{border:1px solid var(--border);width:100%;color:var(--body);font:inherit;background:#fff;border-radius:12px;outline:none;padding:12px 14px;font-weight:600;transition:border-color .15s,box-shadow .15s}.wt-scope select:focus{border-color:var(--brand-2);box-shadow:0 0 0 3px #2eb7d32e}.wt-scope .error,.wt-scope .studio-error,.wt-scope .setup-error{color:#991b1b;background:#fee2e2;border:1px solid #fecaca;border-radius:14px;padding:12px 14px;font-size:14px;font-weight:600;line-height:1.5;display:none}.wt-scope .error.visible{display:block}.wt-scope .warn-box{color:#92400e;background:#fef3c7;border:1px solid #fcd34d;border-radius:14px;padding:12px 14px;font-size:14px;font-weight:600;line-height:1.5;display:none}.wt-scope .warn-box.visible{display:block}.wt-scope .content-section{box-shadow:none;background:0 0;border:0;border-radius:0;padding:0}.wt-scope .section-badge{color:var(--brand-2-ink);letter-spacing:.09em;text-transform:uppercase;background:#2eb7d31a;border-radius:999px;margin:0 auto 14px;padding:5px 13px;font-size:11px;font-weight:800;display:table}.wt-scope .content-section>h2{letter-spacing:-.02em;color:var(--ink);text-align:center;margin:0 0 34px;font-size:clamp(22px,2.6vw,30px);font-weight:800}.wt-scope .content-section>h2:has(+.section-sub){margin-bottom:12px}.wt-scope .section-sub{text-align:center;max-width:560px;color:var(--muted);margin:0 auto 34px;font-size:15px;line-height:1.6}.wt-scope .tips-list{gap:20px;margin:0;padding:0;list-style:none;display:grid}.wt-scope .tips-list li{color:var(--muted);align-items:flex-start;gap:16px;font-size:15px;line-height:1.65;display:flex}.wt-scope .tip-num{color:#fff;background:linear-gradient(180deg, var(--grad-from), var(--grad-to));border-radius:50%;flex-shrink:0;place-items:center;width:34px;height:34px;font-size:14px;font-weight:800;display:grid;box-shadow:0 6px 14px #1f879f38}.wt-scope .info-blocks{flex-direction:column;gap:30px;display:flex}.wt-scope .info-block h3{color:var(--ink);margin:0 0 10px;font-size:17px;font-weight:800}.wt-scope .info-block p,.wt-scope .info-block ul{color:var(--muted);margin:0;font-size:15px;line-height:1.7}.wt-scope .info-block ul{padding-left:20px}.wt-scope .info-block li+li{margin-top:8px}.wt-scope code{color:#334155;background:#f1f5f9;border:1px solid #e5e9f2;border-radius:6px;padding:2px 6px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9em}.wt-scope .content-section.faq-section{box-shadow:none;background:0 0;border:0;padding:0}.wt-scope .faq-list{flex-direction:column;gap:14px;display:flex}.wt-scope .faq-item{border:1px solid var(--border);box-shadow:var(--shadow-sm);background:#fff;border-radius:16px;transition:box-shadow .3s,border-color .2s}.wt-scope .faq-item[open]{box-shadow:var(--shadow-md);border-color:#2eb7d373}.wt-scope .faq-item summary{color:var(--ink);cursor:pointer;justify-content:space-between;align-items:center;gap:14px;padding:20px 22px;font-size:16px;font-weight:600;list-style:none;transition:color .2s;display:flex}.wt-scope .faq-item summary::-webkit-details-marker{display:none}.wt-scope .faq-item summary:hover,.wt-scope .faq-item[open] summary{color:var(--brand-2-ink)}.wt-scope .faq-item summary:after{content:"+";color:var(--faint);flex-shrink:0;font-size:24px;font-weight:300;line-height:1;transition:transform .3s,color .2s}.wt-scope .faq-item summary:hover:after,.wt-scope .faq-item[open] summary:after{color:var(--brand-2)}.wt-scope .faq-item[open] summary:after{transform:rotate(45deg)}.wt-scope .faq-item p{color:var(--muted);margin:0;padding:0 22px 20px;font-size:15px;line-height:1.7}.wt-scope .shot-card{border:1px solid var(--border);background:var(--panel);border-radius:18px;padding:16px;display:none}.wt-scope .shot-card img{object-fit:contain;background:var(--video-bg);border-radius:12px;width:100%;max-height:280px;display:block}.wt-scope .shot-card a{color:var(--brand-ink);margin-top:12px;font-size:14px;font-weight:700;display:inline-block}.wt-scope .visualizer-panel{border:1px solid var(--border);background:var(--panel);border-radius:18px;padding:22px}.wt-scope .visualizer-panel>label{margin-bottom:12px}.wt-scope .meter-wrap{background:#e2e8f0;border-radius:999px;width:100%;height:20px;overflow:hidden}.wt-scope .meter{border-radius:inherit;background:linear-gradient(90deg, var(--brand), var(--brand-2), var(--success));width:0%;height:100%;transition:width 80ms linear}.wt-scope canvas{background:var(--video-bg);border-radius:14px;width:100%;height:240px;margin-top:20px;display:block}.wt-scope .page-view{min-height:100vh;display:none}.wt-scope .page-view.active{flex-direction:column;display:flex}.wt-scope .setup-card{flex-direction:column;gap:26px;padding:36px 32px 40px;display:flex}.wt-scope .setup-card h2{text-align:center;letter-spacing:-.01em;color:var(--ink);margin:0;font-size:21px;font-weight:800}.wt-scope .setup-card .sub{text-align:center;color:var(--muted);margin:-14px 0 0;font-size:15px;line-height:1.6}.wt-scope .source-choices{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.wt-scope .source-toggle{border:2px solid var(--border);min-height:196px;color:var(--ink);font:inherit;cursor:pointer;background:#fff;border-radius:22px;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:28px 20px;font-size:15px;font-weight:800;transition:border-color .18s,background .18s,transform .18s,box-shadow .18s;display:flex}.wt-scope .source-toggle:hover{border-color:var(--border-strong);box-shadow:var(--shadow-sm);transform:translateY(-3px)}.wt-scope .source-icon-wrap{width:84px;height:84px;color:var(--brand);background:linear-gradient(145deg,#007be91a,#2eb7d31a);border-radius:22px;place-items:center;transition:background .18s,color .18s,transform .18s;display:grid}.wt-scope .source-icon{stroke:currentColor;fill:none;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:48px;height:48px}.wt-scope .source-toggle.on{border-color:var(--brand-2);background:linear-gradient(#00bfe314,#2eb7d30d);box-shadow:0 16px 38px #007be924}.wt-scope .source-toggle.on .source-icon-wrap{color:#fff;background:linear-gradient(135deg, var(--grad-from), var(--grad-to));transform:scale(1.03);box-shadow:0 12px 26px #1f879f4d}.wt-scope #pagePreview.active,.wt-scope #pagePlayback.active{flex-direction:column;min-height:100dvh;display:flex}.wt-scope .studio-shell{flex-direction:column;flex:1;width:min(1040px,100% - 40px);margin:0 auto;padding:28px 0 0;display:flex}.wt-scope .studio-topbar{flex-shrink:0;align-items:center;padding:0 0 18px;display:flex}.wt-scope .studio-main{flex-direction:column;flex:1;min-height:0;padding:0 0 16px;display:flex}.wt-scope .preview-frame,.wt-scope .playback-frame{flex-direction:column;align-items:center;width:100%;display:flex}.wt-scope .preview-aspect-box{aspect-ratio:16/9;border:1px solid var(--border);background:var(--video-bg);width:100%;min-height:180px;box-shadow:var(--shadow-sm);border-radius:20px;position:relative;overflow:hidden}.wt-scope .preview-aspect-box.is-sized{aspect-ratio:auto;min-height:0}.wt-scope .preview-aspect-box .stage,.wt-scope .playback-frame .preview-aspect-box .stage{border-radius:0;width:100%;height:100%;position:absolute;inset:0}.wt-scope .stage video{object-fit:cover;background:var(--video-bg);width:100%;height:100%;display:block}.wt-scope .stage video.mirrored{transform:scaleX(-1)}.wt-scope .video-layer{opacity:0;visibility:hidden;pointer-events:none}.wt-scope .video-layer.is-active{opacity:1;visibility:visible;pointer-events:auto}.wt-scope #screenVideo,.wt-scope #mainVideo{position:absolute;inset:0}.wt-scope #screenVideo.is-active,.wt-scope #mainVideo.is-active{position:relative}.wt-scope #cameraPip{object-fit:cover;z-index:2;border:3px solid #ffffffeb;border-radius:16px;min-height:0;max-height:40%;position:absolute;box-shadow:0 16px 40px #0f172a47}.wt-scope #cameraPip.pip-br{inset:auto 20px 20px auto}.wt-scope #cameraPip.pip-bl{inset:auto auto 20px 20px}.wt-scope #cameraPip.pip-tr{inset:20px 20px auto auto}.wt-scope #cameraPip.pip-tl{inset:20px auto auto 20px}.wt-scope #cameraPip:not(.is-active){opacity:0;visibility:hidden;pointer-events:none}.wt-scope .audio-only-stage{background:var(--video-bg);flex-direction:column;justify-content:center;gap:20px;padding:40px 28px;display:none;position:absolute;inset:0}.wt-scope .audio-only-stage.active{display:flex}.wt-scope .audio-only-stage label{color:#94a3b8;letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:12px;font-weight:800}.wt-scope .audio-only-stage .meter-wrap{background:#ffffff1a;height:22px}.wt-scope .audio-wave{background:#0f172a80;border-radius:14px;width:100%;height:min(240px,32vh);margin:0;display:block}.wt-scope .audio-only-stage p{text-align:center;color:#64748b;margin:0;font-size:14px}.wt-scope .preview-aspect-box .placeholder{z-index:4;background:#0f172ab8;place-items:center;display:none}.wt-scope .preview-aspect-box .placeholder.is-visible{display:grid}.wt-scope .studio-dock{flex-shrink:0;padding:0 0 32px}.wt-scope .dock-panel{border:1px solid var(--border);background:var(--card);box-shadow:var(--shadow-sm);border-radius:24px;flex-direction:column;gap:16px;padding:22px 24px 24px;display:flex}.wt-scope .dock-inner{flex-direction:column;gap:16px;width:100%;display:flex}.wt-scope .input-chips{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.wt-scope .input-chip{border:2px solid var(--border);color:var(--muted);font:inherit;cursor:pointer;background:#fff;border-radius:16px;align-items:center;gap:12px;padding:14px 16px;font-size:14px;font-weight:800;transition:border-color .18s,background .18s,color .18s;display:flex}.wt-scope .input-chip:hover{border-color:var(--border-strong)}.wt-scope .input-chip.is-loading{opacity:.65;pointer-events:none}.wt-scope .input-chip .chip-icon-wrap{width:44px;height:44px;color:var(--brand);background:#007be914;border-radius:12px;flex-shrink:0;place-items:center;display:grid}.wt-scope .input-chip .source-icon{width:26px;height:26px}.wt-scope .input-chip .chip-label{text-align:left;flex:1;min-width:0}.wt-scope .chip-vu{background:#007be91f;border-radius:999px;flex-direction:column;flex-shrink:0;justify-content:flex-end;width:6px;height:34px;display:flex;overflow:hidden}.wt-scope .chip-vu-fill{border-radius:inherit;background:linear-gradient(180deg, var(--brand-2), var(--brand));width:100%;height:0%;transition:height 60ms linear}.wt-scope .chip-vu.is-idle .chip-vu-fill{height:0!important}.wt-scope .input-chip[data-source=mic]:not(.on) .chip-vu{display:none}.wt-scope .input-chip .chip-state{letter-spacing:.06em;text-transform:uppercase;color:var(--faint);background:#eef2f7;border-radius:999px;padding:4px 8px;font-size:11px;font-weight:900}.wt-scope .input-chip.on{border-color:var(--brand-2);color:var(--ink);background:linear-gradient(#00bfe314,#2eb7d30d)}.wt-scope .input-chip.on .chip-icon-wrap{color:#fff;background:linear-gradient(135deg, var(--grad-from), var(--grad-to))}.wt-scope .input-chip.on .chip-state{color:var(--brand-ink);background:#007be91f}.wt-scope .dock-settings{flex-direction:column;gap:10px;display:flex}.wt-scope .setting-panel{border:1px solid var(--border);background:var(--panel);border-radius:16px;flex-direction:column;gap:12px;padding:14px 16px;display:flex}.wt-scope .setting-panel.hidden,.wt-scope .pip-layout-section.hidden{display:none}.wt-scope .field-label{color:var(--muted);letter-spacing:.07em;text-transform:uppercase;margin-bottom:6px;font-size:11px;font-weight:800;display:block}.wt-scope .field-label.label-title{text-transform:none;letter-spacing:.01em;font-size:12px}.wt-scope .setting-panel select{border-radius:12px;padding:11px 12px}.wt-scope .camera-toolbar{align-items:center;gap:10px;display:flex}.wt-scope .mirror-toggle{border:2px solid var(--border);color:var(--ink);font:inherit;cursor:pointer;background:#fff;border-radius:12px;align-items:center;gap:8px;padding:10px 16px;font-size:13px;font-weight:800;transition:border-color .18s,background .18s,color .18s;display:inline-flex}.wt-scope .mirror-toggle:hover:not(:disabled){border-color:var(--border-strong)}.wt-scope .mirror-toggle.on{border-color:var(--brand-2);color:var(--brand-2-ink);background:#2eb7d314}.wt-scope .mirror-toggle:disabled{opacity:.45;cursor:not-allowed}.wt-scope .pip-layout-section{border-top:1px solid var(--border);flex-wrap:wrap;align-items:flex-start;gap:18px 28px;padding-top:14px;display:flex}.wt-scope .pip-block{flex-direction:column;flex:none;gap:6px;width:fit-content;display:flex}.wt-scope .pip-corner-picker{grid-template-columns:repeat(2,34px);gap:6px;width:fit-content;display:grid}.wt-scope .pip-corner-btn{border:1.5px solid var(--border);width:34px;height:30px;color:var(--muted);cursor:pointer;background:#fff;border-radius:8px;padding:0;transition:border-color .18s,background .18s,color .18s;position:relative}.wt-scope .pip-corner-btn:before{content:"";opacity:.35;border:1px solid;border-radius:3px;position:absolute;inset:5px}.wt-scope .pip-corner-btn .pip-dot{background:currentColor;border-radius:50%;width:5px;height:5px;position:absolute}.wt-scope .pip-corner-btn[data-pip-pos=tl] .pip-dot{top:6px;left:6px}.wt-scope .pip-corner-btn[data-pip-pos=tr] .pip-dot{top:6px;right:6px}.wt-scope .pip-corner-btn[data-pip-pos=bl] .pip-dot{bottom:6px;left:6px}.wt-scope .pip-corner-btn[data-pip-pos=br] .pip-dot{bottom:6px;right:6px}.wt-scope .pip-corner-btn:hover:not(:disabled),.wt-scope .pip-size-btn:hover:not(:disabled){border-color:var(--border-strong)}.wt-scope .pip-corner-btn.active,.wt-scope .pip-size-btn.active{border-color:var(--brand-2);color:var(--brand-2-ink);background:#2eb7d31a}.wt-scope .pip-corner-btn:disabled,.wt-scope .pip-size-btn:disabled{opacity:.45;cursor:not-allowed}.wt-scope .pip-size-segment{gap:6px;width:fit-content;display:inline-flex}.wt-scope .pip-size-btn{border:1.5px solid var(--border);min-width:34px;color:var(--muted);font:inherit;cursor:pointer;background:#fff;border-radius:8px;padding:7px 10px;font-size:12px;font-weight:900;transition:border-color .18s,background .18s,color .18s}.wt-scope .dock-record-zone{border-top:1px solid var(--border);padding-top:6px}.wt-scope .record-cta{letter-spacing:.01em;border-radius:999px;width:100%;padding:18px 24px;font-size:17px;font-weight:800}.wt-scope .record-cta:not(:disabled){box-shadow:0 14px 32px #ef444452}.wt-scope #pagePlayback{min-height:100dvh}.wt-scope .playback-main{flex-direction:column;flex:1;gap:24px;padding:0 0 40px;display:flex}.wt-scope .playback-frame video{object-fit:contain;background:var(--video-bg);width:100%;height:100%;display:block}.wt-scope .playback-actions{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.wt-scope .back-link{color:var(--brand-ink);align-items:center;gap:8px;padding:6px 0;font-size:15px;font-weight:700;text-decoration:none;display:inline-flex}.wt-scope .back-link:hover{color:var(--brand);text-decoration:underline}.wt-scope .feature-card{text-align:center;flex-direction:column;align-items:center;gap:4px;padding:8px 6px;display:flex}.wt-scope .feature-icon{width:54px;height:54px;color:var(--brand);background:linear-gradient(145deg,#007be91a,#2eb7d31a);border-radius:16px;place-items:center;margin-bottom:10px;display:grid}.wt-scope .feature-icon svg,.wt-scope .use-card svg,.wt-scope .step-num svg{stroke:currentColor;fill:none;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round}.wt-scope .feature-icon svg{width:26px;height:26px}.wt-scope .feature-card h3,.wt-scope .step-card h3{color:var(--ink);margin:0 0 6px;font-size:16px;font-weight:800}.wt-scope .feature-card p,.wt-scope .step-card p{color:var(--muted);margin:0;font-size:14px;line-height:1.6}.wt-scope .dropzone{text-align:center;cursor:pointer;background:#2eb7d30a;border:2px dashed #2eb7d366;border-radius:18px;padding:38px 24px;transition:border-color .18s,background .18s,transform .18s;display:block}.wt-scope .dropzone:hover,.wt-scope .dropzone.dragover{border-color:var(--brand-2);background:#2eb7d317;transform:translateY(-2px)}.wt-scope .dropzone strong{color:var(--ink);margin-bottom:8px;font-size:16px;font-weight:800;display:block}.wt-scope .dropzone p{color:var(--muted);margin:0;font-size:14px;line-height:1.6}.wt-scope .dropzone input{display:none}.wt-scope .preview-stage{border:1px solid var(--border);background:var(--video-bg);border-radius:18px;display:none;overflow:hidden}.wt-scope .preview-stage.visible{display:block}.wt-scope .preview-stage video{object-fit:contain;max-height:280px}.wt-scope .preview-meta{border-top:1px solid var(--border);background:#fff;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:14px;display:grid}.wt-scope .preview-meta div span,.wt-scope .result-stats div span{color:var(--muted);text-transform:uppercase;letter-spacing:.07em;font-size:11px;font-weight:800;display:block}.wt-scope .preview-meta div strong,.wt-scope .result-stats div strong{color:var(--ink);word-break:break-word;margin-top:4px;font-size:15px;font-weight:800;display:block}.wt-scope .settings{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:none}.wt-scope .settings.visible{display:grid}.wt-scope .field label{margin-bottom:8px;font-size:12px}.wt-scope .field select{border-radius:12px;font-weight:600}.wt-scope .field .hint{color:var(--faint);margin:8px 0 0;font-size:12px;line-height:1.5}.wt-scope .progress-wrap{flex-direction:column;gap:10px;display:none}.wt-scope .progress-wrap.visible{display:flex}.wt-scope .progress-bar{background:#007be91f;border-radius:999px;height:12px;overflow:hidden}.wt-scope .progress-fill{border-radius:inherit;background:linear-gradient(90deg, var(--brand), var(--brand-2));width:0%;height:100%;transition:width .18s}.wt-scope .progress-meta{color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:13px;font-weight:700;display:flex}.wt-scope .result-panel{background:#10b98112;border:1px solid #10b98138;border-radius:18px;padding:20px;display:none}.wt-scope .result-panel.visible{display:block}.wt-scope .result-panel h3{color:var(--ink);margin:0 0 14px;font-size:16px;font-weight:800}.wt-scope .result-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:16px;display:grid}.wt-scope .savings{color:var(--success)}.wt-scope .codec-pill{color:var(--brand-ink);background:#007be91a;border-radius:999px;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:800;display:inline-flex}.wt-scope .feature-grid,.wt-scope .steps-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;display:grid}.wt-scope .step-card{text-align:left;background:0 0;border:0;padding:0}.wt-scope .step-num{color:#fff;background:linear-gradient(180deg, var(--grad-from), var(--grad-to));border-radius:50%;place-items:center;width:36px;height:36px;margin-bottom:14px;font-size:15px;font-weight:800;display:grid;box-shadow:0 6px 14px #1f879f38}.wt-scope .use-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.wt-scope .use-card{border:1px solid var(--border);text-align:center;color:var(--ink);box-shadow:var(--shadow-sm);background:#fff;border-radius:14px;justify-content:center;align-items:center;gap:10px;padding:16px 18px;font-size:14px;font-weight:700;transition:border-color .18s,transform .18s,box-shadow .18s;display:flex}.wt-scope .use-card svg{width:20px;height:20px;color:var(--brand);flex-shrink:0}.wt-scope .use-card:hover{border-color:var(--brand-2);box-shadow:var(--shadow-sm);transform:translateY(-2px)}.wt-scope .howmuch-grid{grid-template-columns:1fr 1fr;align-items:center;gap:32px;display:grid}.wt-scope .howmuch-list{flex-direction:column;gap:16px;margin:0;padding:0;list-style:none;display:flex}.wt-scope .howmuch-list li{color:var(--muted);align-items:baseline;gap:12px;font-size:15px;line-height:1.5;display:flex}.wt-scope .howmuch-list li:before{content:"";background:var(--brand);border-radius:50%;flex-shrink:0;width:8px;height:8px;margin-top:6px}.wt-scope .howmuch-list strong{color:var(--ink);font-weight:800}.wt-scope .compress-diagram{background:linear-gradient(145deg,#007be912,#2eb7d312);border-radius:20px;justify-content:center;align-items:center;gap:14px;padding:28px 20px;display:flex}.wt-scope .compress-diagram .dbox{width:64px;height:64px;color:var(--brand);box-shadow:var(--shadow-sm);background:#fff;border-radius:16px;flex-shrink:0;place-items:center;display:grid}.wt-scope .compress-diagram .dbox svg{stroke:currentColor;fill:none;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:30px;height:30px}.wt-scope .compress-diagram .arrow{color:var(--brand-2);flex-shrink:0;font-size:22px;font-weight:700}.wt-scope .compress-diagram .pct{text-align:center;width:96px;height:96px;color:var(--brand-ink);box-shadow:var(--shadow-sm);background:#fff;border:2px solid #007be940;border-radius:50%;flex-shrink:0;place-items:center;display:grid}.wt-scope .compress-diagram .pct b{color:var(--brand);font-size:24px;font-weight:900;line-height:1;display:block}.wt-scope .compress-diagram .pct span{color:var(--muted);margin-top:2px;font-size:11px;font-weight:700;display:block}@media (max-width:900px){.wt-scope .feature-grid,.wt-scope .steps-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:720px){.wt-scope .shell,.wt-scope .setup-shell{padding:36px 0 64px}.wt-scope .shell>*+*,.wt-scope .setup-shell>*+*{margin-top:36px}.wt-scope .work-card{border-radius:20px;padding:22px 20px}.wt-scope .content-section{border-radius:20px;padding:28px 22px}.wt-scope .setup-card{padding:26px 20px 30px}.wt-scope .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.wt-scope .stage,.wt-scope video{min-height:240px}.wt-scope .source-choices{grid-template-columns:1fr}.wt-scope .source-toggle{flex-direction:row;justify-content:flex-start;gap:18px;min-height:150px}.wt-scope .input-chips,.wt-scope .settings,.wt-scope .preview-meta,.wt-scope .result-stats,.wt-scope .feature-grid,.wt-scope .steps-grid,.wt-scope .use-grid,.wt-scope .howmuch-grid{grid-template-columns:1fr}.wt-scope .use-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wt-scope .controls>*{text-align:center;flex:100%}.wt-scope .work-card-head{flex-direction:column;align-items:flex-start}}@media (max-width:480px){.wt-scope .metrics{grid-template-columns:1fr}.wt-scope .source-icon-wrap{border-radius:18px;width:64px;height:64px}.wt-scope .source-icon{width:38px;height:38px}.wt-scope canvas{height:200px}}
