/* Bilipedia Video Downloader - builds on style.css design tokens */
.vdl-form{padding:22px;position:relative}
.vdl-input-row{display:flex;gap:10px;align-items:stretch}
.vdl-input-wrap{position:relative;flex:1;min-width:0;display:flex;align-items:center}
.vdl-input-wrap .bp-form-input{padding:15px 96px 15px 46px;font-size:1rem;border-radius:14px;height:100%}
.vdl-input-icon{position:absolute;left:16px;font-size:1.25rem;color:var(--text-3);display:flex;pointer-events:none}
.vdl-paste{position:absolute;right:8px;border:1px solid var(--border);background:var(--bg-card2);color:var(--text-2);border-radius:10px;padding:7px 12px;font-size:.82rem;font-weight:600;cursor:pointer;transition:.15s}
.vdl-paste:hover{border-color:var(--border-pink);color:var(--pink)}
.vdl-go{white-space:nowrap;padding:0 26px;border-radius:14px;font-size:1rem;font-weight:700;display:inline-flex;align-items:center;gap:8px;justify-content:center;min-height:52px}
.vdl-go:disabled{opacity:.75;cursor:wait}
.vdl-platforms{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0;padding:0}
.vdl-platforms a{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border:1px solid var(--border);border-radius:999px;background:var(--bg-card2);color:var(--text-2);font-size:.86rem;font-weight:600;text-decoration:none;transition:.15s}
.vdl-platforms a:hover,.vdl-platforms a.active{border-color:var(--border-pink);background:var(--pink-dim);color:var(--text)}

.vdl-msg{margin:14px 0;padding:13px 16px;border-radius:12px;font-size:.93rem;display:flex;gap:10px;align-items:flex-start;line-height:1.5}
.vdl-msg-error{background:rgba(220,38,38,.08);border:1px solid rgba(220,38,38,.25);color:#b91c1c}
.vdl-msg-info{background:var(--blue-dim);border:1px solid rgba(37,99,235,.25);color:var(--blue)}

.vdl-card{margin-top:16px;padding:20px}
.vdl-head{display:flex;gap:16px;align-items:center;padding-bottom:16px;border-bottom:1px solid var(--border);margin-bottom:14px}
.vdl-thumb{width:168px;aspect-ratio:16/9;object-fit:cover;border-radius:12px;background:var(--bg-card2);border:1px solid var(--border);flex:none}
.vdl-thumb-ph{display:flex;align-items:center;justify-content:center;font-size:2.4rem}
.vdl-head-title{font-weight:700;font-size:1.05rem;line-height:1.35;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.vdl-head-sub{margin-top:6px;color:var(--text-3);font-size:.86rem;display:flex;gap:6px;align-items:center}

.vdl-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.vdl-tab{border:1px solid var(--border);background:transparent;color:var(--text-2);padding:8px 14px;border-radius:10px;font-weight:600;font-size:.88rem;cursor:pointer;display:inline-flex;gap:7px;align-items:center;transition:.15s}
.vdl-tab em{font-style:normal;font-size:.75rem;background:var(--bg-card2);border:1px solid var(--border);border-radius:999px;padding:0 7px}
.vdl-tab.active{background:var(--pink);border-color:var(--pink);color:#fff}
.vdl-tab.active em{background:rgba(255,255,255,.22);border-color:transparent;color:#fff}

.vdl-rows{display:flex;flex-direction:column;gap:8px}
.vdl-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:var(--bg-card2);transition:.15s}
.vdl-row:hover{border-color:var(--border-pink)}
.vdl-row-main{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
.vdl-q{font-weight:800;font-size:1.02rem;color:var(--text);min-width:60px}
.vdl-ext,.vdl-size,.vdl-nt{font-size:.8rem;color:var(--text-3)}
.vdl-ext{font-weight:700;letter-spacing:.04em}
.vdl-b{font-size:.68rem;font-weight:800;padding:2px 7px;border-radius:6px;letter-spacing:.05em}
.vdl-b-pink{background:var(--pink-dim);color:var(--pink-dark)}
.vdl-b-blue{background:var(--blue-dim);color:var(--blue)}
.vdl-row-act{display:flex;align-items:center;gap:10px;flex:none}
.vdl-bar{width:90px;height:6px;border-radius:99px;background:var(--border);overflow:hidden}
.vdl-bar[hidden]{display:none}
.vdl-bar i{display:block;height:100%;width:0;background:var(--pink);border-radius:99px;transition:width .6s ease}
.vdl-dl{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:10px;border:0;background:var(--pink);color:#fff;font-weight:700;font-size:.88rem;cursor:pointer;text-decoration:none;white-space:nowrap;transition:.15s}
.vdl-dl:hover{background:var(--pink-dark);color:#fff}
.vdl-dl:disabled{opacity:.8;cursor:wait}
.vdl-save{background:var(--green)}
.vdl-save:hover{background:#12813c}
.vdl-note{margin:12px 2px 0;color:var(--text-3);font-size:.85rem;display:flex;gap:7px}

.vdl-spin{width:14px;height:14px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;display:inline-block;animation:vdlspin .7s linear infinite}
@keyframes vdlspin{to{transform:rotate(360deg)}}
.vdl-sk{height:44px;border-radius:12px;margin-top:8px;background:linear-gradient(90deg,var(--bg-card2),var(--border),var(--bg-card2));background-size:200% 100%;animation:vdlsk 1.2s infinite}
.vdl-sk-h{height:90px;margin:0 0 12px}
@keyframes vdlsk{to{background-position:-200% 0}}

.vdl-steps{margin:38px 0 8px}
.vdl-steps h2{font-size:1.4rem;margin-bottom:16px}
.vdl-steps ol{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.vdl-steps li{display:flex;gap:14px;padding:18px;border:1px solid var(--border);border-radius:16px;background:var(--bg-card)}
.vdl-steps li>span{flex:none;width:36px;height:36px;border-radius:50%;background:var(--pink);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center}
.vdl-steps strong{display:block;margin-bottom:3px}
.vdl-steps p{margin:0;color:var(--text-2);font-size:.9rem;line-height:1.5}
.vdl-features{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0 10px}
.vdl-features>div{padding:16px;border-radius:14px;background:var(--bg-card2);border:1px solid var(--border)}
.vdl-features i{color:var(--pink);font-size:1.3rem;display:block;margin-bottom:6px}
.vdl-features p{margin:2px 0 0;color:var(--text-3);font-size:.85rem}
.vdl-legal{display:flex;gap:12px;margin-top:26px;padding:14px 16px;border-radius:12px;background:var(--gold-dim);color:var(--text-2);font-size:.88rem;line-height:1.55}
.vdl-legal i{color:var(--gold);font-size:1.1rem;margin-top:2px}
.vdl-legal p{margin:0}

@media (max-width:768px){
  .vdl-input-row{flex-direction:column}
  .vdl-go{min-height:50px;width:100%}
  .vdl-head{flex-direction:column;align-items:flex-start}
  .vdl-thumb{width:100%}
  .vdl-steps ol{grid-template-columns:1fr}
  .vdl-features{grid-template-columns:repeat(2,1fr)}
  .vdl-row{flex-direction:column;align-items:stretch}
  .vdl-row-act{justify-content:space-between}
  .vdl-dl{flex:1;justify-content:center}
  .vdl-bar{flex:1}
}
@media (prefers-reduced-motion:reduce){.vdl-spin,.vdl-sk{animation:none}}