.ytvd-widget, .ytvd-widget * { box-sizing: border-box; }
.ytvd-widget {
  --ytvd-primary: #6448e8; --ytvd-primary-2: #5538dd;
  --ytvd-text: #182135; --ytvd-sub: #697288; --ytvd-line: #e5e8f0;
  --ytvd-surface: #fff; --ytvd-pale: #f7f8fc;
  width: 100%; max-width: 810px; margin: 26px auto; padding: 32px;
  background: var(--ytvd-surface); border: 1px solid var(--ytvd-line);
  border-radius: 20px; box-shadow: 0 13px 45px rgba(25,34,63,.06);
  color: var(--ytvd-text); font: 400 15px/1.5 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.ytvd-widget [hidden] { display: none !important; }
.ytvd-heading { text-align: center; margin-bottom: 23px; }
.ytvd-eyebrow { display: inline-block; color: var(--ytvd-primary); font-weight: 750; font-size: 11px; letter-spacing: 1.5px; }
.ytvd-heading h2 { margin: 9px 0 6px; padding: 0; color: var(--ytvd-text); font: 780 clamp(23px, 3.4vw, 31px)/1.22 system-ui, sans-serif; letter-spacing: -.75px; }
.ytvd-heading p { margin: 0; color: var(--ytvd-sub); font-size: 14px; }
.ytvd-tabs { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 7px; padding: 6px; background: var(--ytvd-pale); border-radius: 12px; margin-bottom: 19px; }
.ytvd-widget button, .ytvd-widget select, .ytvd-widget input { font: inherit; }
.ytvd-widget button { cursor: pointer; }
.ytvd-widget button:disabled { cursor: wait; opacity: .68; }
.ytvd-tab { flex: 1 1 auto; min-width: 82px; min-height: 40px; padding: 7px 13px; border: 0 !important; border-radius: 9px; background: transparent !important; color: #626d85 !important; box-shadow: none !important; font-size: 13px !important; font-weight: 650; line-height: 1.2; }
.ytvd-tab.is-active { color: var(--ytvd-primary) !important; background: #fff !important; box-shadow: 0 3px 11px rgba(38,48,80,.1) !important; }
.ytvd-tab:focus-visible, .ytvd-widget a:focus-visible, .ytvd-widget button:focus-visible, .ytvd-widget select:focus-visible, .ytvd-widget input:focus-visible { outline: 2px solid var(--ytvd-primary); outline-offset: 2px; }
.ytvd-form { margin: 0; padding: 0; }
.ytvd-input-wrap { display: flex; align-items: stretch; position: relative; background: #fff; border: 1px solid #d8ddea; border-radius: 12px; padding: 5px; min-height: 58px; transition: border-color .2s ease; }
.ytvd-input-wrap:focus-within { border-color: var(--ytvd-primary); }
.ytvd-link-mark { display: flex; align-items: center; justify-content: center; flex: 0 0 42px; color: #959fb0; font-size: 23px; font-weight: 600; }
.ytvd-url, .ytvd-url:focus { min-width: 0; width: 100%; flex: 1; border: 0 !important; outline: 0 !important; box-shadow: none !important; background: transparent !important; color: var(--ytvd-text) !important; padding: 9px 7px !important; margin: 0 !important; font-size: 14px !important; line-height: 1.4; height: auto !important; }
.ytvd-url::placeholder { color: #9aa2b4; }
.ytvd-fetch, .ytvd-start, .ytvd-thumbnail-link, .ytvd-file { display: inline-flex; justify-content: center; align-items: center; gap: 8px; text-decoration: none !important; padding: 11px 23px !important; border: 1px solid var(--ytvd-primary) !important; background: var(--ytvd-primary) !important; color: #fff !important; border-radius: 9px !important; font-weight: 700 !important; font-size: 14px !important; line-height: 1.2 !important; white-space: nowrap; box-shadow: none !important; transition: background .15s ease, transform .15s ease; }
.ytvd-fetch:hover, .ytvd-start:hover, .ytvd-thumbnail-link:hover, .ytvd-file:hover { background: var(--ytvd-primary-2) !important; color: #fff !important; transform: translateY(-1px); }
.ytvd-hint { text-align: center; margin-top: 9px; font-size: 12px; color: #939bab; }
.ytvd-message { margin-top: 14px; padding: 11px 14px; border: 1px solid #dfe5f0; background: #f7f9fd; color: #536079; border-radius: 10px; font-size: 13px; overflow-wrap: anywhere; }
.ytvd-message[data-kind="error"] { background: #fff6f6; border-color: #f4d2d2; color: #b33337; }
.ytvd-message[data-kind="success"] { background: #f2fbf6; border-color: #d0edde; color: #23794c; }
.ytvd-message[data-kind="warning"] { background: #fff9e9; border-color: #f0deb1; color: #885c12; }
.ytvd-result { margin-top: 17px; padding: 18px; background: var(--ytvd-pale); border: 1px solid var(--ytvd-line); border-radius: 13px; }
.ytvd-media { display: flex; align-items: center; gap: 16px; min-width: 0; }
.ytvd-thumb { width: 137px; max-width: 38%; height: 84px; object-fit: cover; border-radius: 9px; border: 1px solid #e7eaf2; flex-shrink: 0; background: #e4e7f0; }
.ytvd-meta { min-width: 0; }
.ytvd-meta-tag { color: #838ca0; font-size: 10px; letter-spacing: 1px; font-weight: 750; }
.ytvd-video-title { font: 720 15px/1.45 system-ui, sans-serif !important; margin: 4px 0 3px !important; padding: 0 !important; color: var(--ytvd-text) !important; overflow-wrap: anywhere; }
.ytvd-duration { font-size: 12px; color: var(--ytvd-sub); }
.ytvd-controls { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.ytvd-controls label { display: flex; flex-direction: column; flex: 1 1 145px; gap: 5px; font-size: 12px; font-weight: 700; color: #505b72; margin: 0; }
.ytvd-controls select { width: 100%; height: 43px; min-height: 43px; margin: 0 !important; border: 1px solid #d9deea !important; border-radius: 9px !important; padding: 8px 12px !important; color: var(--ytvd-text) !important; background: #fff !important; font-size: 13px !important; box-shadow: none !important; }
.ytvd-start, .ytvd-thumbnail-link { min-height: 43px; flex: 0 1 auto; }
.ytvd-file { display: flex; margin-top: 15px; width: 100%; min-height: 45px; }
.ytvd-progress { margin-top: 15px; }
.ytvd-progress-track { height: 8px; background: #dfe3ed; border-radius: 999px; overflow: hidden; }
.ytvd-progress-bar { width: 0; height: 100%; background: var(--ytvd-primary); transition: width .35s ease; border-radius: inherit; }
.ytvd-progress-label { margin-top: 7px; font-size: 12px; color: var(--ytvd-sub); text-transform: capitalize; overflow-wrap: anywhere; }
.ytvd-disabled { font-size: 13px; border: 1px solid #eecf99; padding: 14px; border-radius: 8px; }
@media (max-width: 580px) {
  .ytvd-widget { padding: 22px 16px; border-radius: 14px; }
  .ytvd-heading h2 { font-size: 24px; }
  .ytvd-tab { font-size: 12px !important; min-width: 75px; padding: 8px; }
  .ytvd-input-wrap { flex-wrap: wrap; }
  .ytvd-link-mark { flex: 0 0 28px; }
  .ytvd-url { width: calc(100% - 32px); min-height: 40px; }
  .ytvd-fetch { flex: 1 0 100%; width: 100%; min-height: 43px; }
  .ytvd-controls { flex-direction: column; align-items: stretch; }
  .ytvd-controls label, .ytvd-start, .ytvd-thumbnail-link { flex: auto; width: 100%; }
  .ytvd-thumb { width: 105px; height: 73px; }
  .ytvd-result { padding: 13px; }
}
@media (prefers-reduced-motion: reduce) { .ytvd-widget *, .ytvd-widget *::before, .ytvd-widget *::after { transition: none !important; } }