.wpvwt-wrap{
  --wpvwt-primary:#2563eb;
  --wpvwt-primary-dark:#1d4ed8;
  --wpvwt-text:#0f172a;
  --wpvwt-muted:#64748b;
  --wpvwt-border:#e2e8f0;
  --wpvwt-soft:#f8fafc;
  max-width:1120px;
  margin:32px auto;
  padding:0 16px;
  box-sizing:border-box;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--wpvwt-text);
}
.wpvwt-wrap *{box-sizing:border-box}
.wpvwt-card{
  background:#fff;
  border:1px solid var(--wpvwt-border);
  border-radius:24px;
  overflow:hidden;
  box-shadow:0 20px 55px rgba(15,23,42,.09);
}
.wpvwt-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:24px;
  padding:30px 34px;
  border-bottom:1px solid var(--wpvwt-border);
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);
}
.wpvwt-eyebrow,.wpvwt-preview-kicker{
  display:block;
  color:var(--wpvwt-primary);
  font-size:11px;
  line-height:1;
  letter-spacing:.14em;
  font-weight:800;
  margin-bottom:9px;
}
.wpvwt-head h2{margin:0 0 8px;font-size:30px;line-height:1.15;letter-spacing:-.03em}
.wpvwt-head p{margin:0;max-width:650px;color:var(--wpvwt-muted);font-size:14px;line-height:1.55}
.wpvwt-browser-badge{
  flex:0 0 auto;
  padding:8px 11px;
  border:1px solid #dbeafe;
  border-radius:999px;
  background:#eff6ff;
  color:#1d4ed8;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
}
.wpvwt-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.8fr);gap:0}
.wpvwt-main{padding:28px 34px}
.wpvwt-section{padding:0 0 27px;margin-bottom:27px;border-bottom:1px solid var(--wpvwt-border)}
.wpvwt-section:last-of-type{margin-bottom:0}
.wpvwt-section-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:18px}
.wpvwt-section-head h3{margin:0 0 4px;font-size:16px;line-height:1.3}
.wpvwt-section-head p{margin:0;color:var(--wpvwt-muted);font-size:12px;line-height:1.45}
.wpvwt-step{
  display:grid;place-items:center;flex:0 0 32px;height:32px;
  border-radius:10px;background:#eff6ff;color:var(--wpvwt-primary);
  font-size:11px;font-weight:800;
}
.wpvwt-label{display:flex;align-items:center;gap:6px;font-weight:700;font-size:13px;margin-bottom:8px}
.wpvwt-label span{font-weight:500;color:#94a3b8;font-size:11px}
.wpvwt-upload{
  display:flex;align-items:center;gap:14px;min-height:82px;
  border:1.5px dashed #cbd5e1;border-radius:15px;padding:16px;
  cursor:pointer;background:var(--wpvwt-soft);transition:.2s ease;
}
.wpvwt-upload:hover,.wpvwt-upload:focus-within{border-color:#60a5fa;background:#eff6ff}
.wpvwt-upload-icon{
  width:44px;height:44px;flex:0 0 44px;border-radius:12px;
  background:var(--wpvwt-primary);color:#fff;display:grid;place-items:center;
  font-size:22px;font-weight:500;
}
.wpvwt-upload-copy{min-width:0;flex:1}
.wpvwt-upload strong,.wpvwt-upload small{display:block}
.wpvwt-upload strong{font-size:14px}
.wpvwt-upload small{color:var(--wpvwt-muted);margin-top:3px;font-size:11px;white-space:normal}
.wpvwt-upload-action{
  flex:0 0 auto;padding:8px 12px;border-radius:9px;background:#fff;
  border:1px solid var(--wpvwt-border);font-size:12px;font-weight:700;color:#334155;
}
.wpvwt-hidden{display:none}
.wpvwt-file{font-size:12px;color:#475569;margin:9px 0 0;min-height:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wpvwt-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.wpvwt-field{min-width:0}
.wpvwt-input,.wpvwt-select{
  width:100%;height:45px;border:1px solid #d1d9e4;border-radius:10px;
  padding:0 12px;background:#fff;color:#0f172a;font-size:14px;outline:none;
  transition:border-color .2s,box-shadow .2s;
}
.wpvwt-input:focus,.wpvwt-select:focus{border-color:#60a5fa;box-shadow:0 0 0 3px rgba(37,99,235,.1)}
.wpvwt-file-input{padding:9px;font-size:12px}
.wpvwt-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.wpvwt-check{
  display:flex;align-items:flex-start;gap:10px;padding:12px;
  border:1px solid var(--wpvwt-border);border-radius:11px;background:#fff;cursor:pointer;
}
.wpvwt-check input{margin:2px 0 0;accent-color:var(--wpvwt-primary)}
.wpvwt-check span{display:block}
.wpvwt-check b,.wpvwt-check small{display:block}
.wpvwt-check b{font-size:12px}
.wpvwt-check small{margin-top:3px;color:var(--wpvwt-muted);font-size:10px}
.wpvwt-settings{display:grid;grid-template-columns:1fr 1.2fr;gap:16px;align-items:end}
.wpvwt-range{display:block;color:#475569;font-size:13px}
.wpvwt-range>span{display:flex;justify-content:space-between;gap:10px;margin-bottom:9px}
.wpvwt-range b{color:#0f172a;font-size:13px}
.wpvwt-range output{font-weight:700;color:var(--wpvwt-primary)}
.wpvwt-range input{display:block;width:100%;accent-color:var(--wpvwt-primary);cursor:pointer}
.wpvwt-action-section{padding-top:0}
.wpvwt-btn{
  display:flex;align-items:center;justify-content:space-between;gap:15px;
  width:100%;min-height:50px;border:0;border-radius:12px;background:#111827;
  color:#fff;padding:13px 16px 13px 18px;font-size:14px;font-weight:800;cursor:pointer;
  transition:transform .15s,background .15s,opacity .15s;
}
.wpvwt-btn:hover:not(:disabled){background:#020617;transform:translateY(-1px)}
.wpvwt-btn:disabled{opacity:.55;cursor:not-allowed}
.wpvwt-btn-arrow{font-size:20px;font-weight:400}
.wpvwt-status{margin:11px 0 7px;color:#475569;font-size:12px;min-height:18px}
.wpvwt-progress{height:7px;background:#e8edf3;border-radius:999px;overflow:hidden}
.wpvwt-progress>div{width:0;height:100%;background:var(--wpvwt-primary);transition:width .15s}
.wpvwt-download{
  display:none;margin-top:12px;text-align:center;background:#16a34a;color:#fff!important;
  text-decoration:none!important;border-radius:11px;padding:12px;font-size:13px;font-weight:800;
}
.wpvwt-preview-panel{
  min-width:0;padding:28px;border-left:1px solid var(--wpvwt-border);background:#f8fafc;
}
.wpvwt-preview-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}
.wpvwt-preview-head h3{margin:0;font-size:16px}
.wpvwt-live-dot{font-size:10px;color:#16a34a;font-weight:700;white-space:nowrap}
.wpvwt-preview-frame{
  position:relative;display:flex;align-items:center;justify-content:center;
  width:100%;min-height:330px;border-radius:15px;overflow:hidden;background:#0f172a;
  border:1px solid #1e293b;
}
.wpvwt-preview-empty{display:flex;align-items:center;justify-content:center;flex-direction:column;color:#cbd5e1;text-align:center;padding:20px}
.wpvwt-preview-empty span{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#1e293b;color:#94a3b8;margin-bottom:10px}
.wpvwt-preview-empty strong{font-size:13px;color:#e2e8f0}
.wpvwt-preview-empty small{margin-top:4px;font-size:10px;color:#94a3b8}
.wpvwt-preview{
  display:none;width:100%;height:auto;max-height:520px;object-fit:contain;
  margin:0;background:#000;
}
.wpvwt-preview-note{display:flex;gap:8px;align-items:flex-start;margin-top:13px}
.wpvwt-preview-note span{color:#16a34a;font-weight:800;font-size:12px}
.wpvwt-preview-note p{margin:0;color:#64748b;font-size:10px;line-height:1.5}
.wpvwt-canvas{display:none}

@media (max-width:900px){
  .wpvwt-layout{grid-template-columns:1fr}
  .wpvwt-preview-panel{border-left:0;border-top:1px solid var(--wpvwt-border)}
  .wpvwt-preview-frame{min-height:260px}
}
@media (max-width:650px){
  .wpvwt-wrap{margin:16px auto;padding:0 10px}
  .wpvwt-card{border-radius:18px}
  .wpvwt-head{padding:22px 18px;display:block}
  .wpvwt-head h2{font-size:24px}
  .wpvwt-head p{font-size:12px}
  .wpvwt-browser-badge{display:inline-block;margin-top:13px}
  .wpvwt-main{padding:21px 18px}
  .wpvwt-preview-panel{padding:21px 18px}
  .wpvwt-section{padding-bottom:22px;margin-bottom:22px}
  .wpvwt-grid,.wpvwt-options,.wpvwt-settings{grid-template-columns:1fr;gap:12px}
  .wpvwt-upload{align-items:flex-start}
  .wpvwt-upload-action{display:none}
  .wpvwt-upload-icon{width:40px;height:40px;flex-basis:40px}
  .wpvwt-upload small{font-size:10px}
  .wpvwt-preview-frame{min-height:230px}
  .wpvwt-btn{min-height:52px}
}
@media (max-width:380px){
  .wpvwt-head h2{font-size:22px}
  .wpvwt-section-head{gap:9px}
  .wpvwt-step{flex-basis:29px;height:29px}
}