/* Minimal, clean styling */
.vdme-wrap { max-width: 1100px; margin: 24px auto; padding: 0 12px; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.vdme-header h2 { margin: 0 0 6px; }
.vdme-sub { margin: 0 0 16px; opacity: 0.85; }
.vdme-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
@media (max-width: 900px){ .vdme-row { grid-template-columns: 1fr; } }
.vdme-card { background: #fff; border: 1px solid rgba(0,0,0,0.08); border-radius: 14px; padding: 16px; box-shadow: 0 4px 18px rgba(0,0,0,0.06); }
.vdme-card h3 { margin: 0 0 10px; font-size: 16px; }
.vdme-field { display:flex; gap: 10px; align-items:center; margin: 10px 0; flex-wrap: wrap; }
.vdme-field label { font-weight: 600; min-width: 90px; }
.vdme-help { font-size: 12px; opacity: 0.75; margin-top: 6px; }
.vdme-status { margin-top: 10px; padding: 10px 12px; border-radius: 12px; background: rgba(0,0,0,0.04); }
.vdme-status.ok { background: rgba(0, 160, 80, 0.10); }
.vdme-btn { appearance:none; border: 1px solid rgba(0,0,0,0.14); background: #f6f6f6; padding: 8px 12px; border-radius: 10px; cursor: pointer; }
.vdme-btn:hover { filter: brightness(0.98); }
.vdme-btn-primary { background: #1f6feb; color: #fff; border-color: rgba(0,0,0,0.0); }
.vdme-btn-danger { background: #e11d48; color: #fff; border-color: rgba(0,0,0,0.0); }
.vdme-params { display:flex; flex-direction: column; gap: 12px; }
.vdme-param-group { border: 1px solid rgba(0,0,0,0.08); border-radius: 12px; padding: 12px; }
.vdme-param-title { font-weight: 700; margin-bottom: 8px; }
.vdme-param { display:grid; grid-template-columns: 200px 1fr 90px; gap: 10px; align-items:center; margin: 8px 0; }
@media (max-width: 700px){ .vdme-param { grid-template-columns: 1fr; } .vdme-param-label{ margin-bottom: -2px; } }
.vdme-param input[type="range"] { width: 100%; }
.vdme-param-num { width: 90px; padding: 6px 8px; border-radius: 10px; border: 1px solid rgba(0,0,0,0.14); }
.vdme-library { display:flex; flex-direction: column; gap: 10px; max-height: 460px; overflow:auto; padding-right: 4px; }
.vdme-patch { border: 1px solid rgba(0,0,0,0.08); border-radius: 12px; padding: 10px 12px; }
.vdme-patch-title { font-weight: 800; margin-bottom: 4px; }
.vdme-patch-meta { font-size: 12px; opacity: 0.75; }
.vdme-patch-actions { display:flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.vdme-empty { opacity: 0.7; font-size: 13px; padding: 12px; }

.vdme-seq-controls { display:flex; gap: 10px; flex-wrap: wrap; align-items:center; margin: 10px 0 12px; }
.vdme-seq-controls input { width: 90px; padding: 6px 8px; border-radius: 10px; border: 1px solid rgba(0,0,0,0.14); }
.vdme-seq-grid { overflow:auto; border: 1px solid rgba(0,0,0,0.08); border-radius: 12px; padding: 10px; }
.vdme-seq-row { display:grid; grid-template-columns: 42px repeat(16, 28px); gap: 6px; align-items:center; margin-bottom: 6px; }
.vdme-seq-cell { height: 26px; border-radius: 8px; border: 1px solid rgba(0,0,0,0.12); background: #f8f8f8; display:flex; align-items:center; justify-content:center; font-size: 11px; }
.vdme-seq-btn { cursor:pointer; }
.vdme-seq-btn.on { background: #111827; }
.vdme-seq-header .vdme-seq-step { background: transparent; border: none; font-weight: 700; }
.vdme-seq-header .vdme-seq-step.active { background: rgba(31,111,235,0.18); border: 1px solid rgba(31,111,235,0.35); }
.vdme-seq-label { background: transparent; border: none; font-weight: 800; }