.vt-app{--bg:#16161c;--card:#22222b;--ink:#f4f1ee;--mute:#a8a6b0;--ac:#ff7a1a;max-width:880px;margin:24px auto;padding:20px;background:var(--bg);color:var(--ink);border-radius:14px;display:grid;gap:18px;font-family:inherit}
.vt-app h3{margin:0 0 10px;font-size:1rem;font-weight:700;color:var(--ink)}
.vt-panel{background:var(--card);border-radius:10px;padding:14px}
.vt-drop{display:flex;align-items:center;justify-content:center;min-height:160px;border:2px dashed #4a4a58;border-radius:8px;cursor:pointer;overflow:hidden;color:var(--mute);text-align:center;padding:10px}
.vt-drop:hover,.vt-drop:focus-within{border-color:var(--ac)}
.vt-pprev{max-height:320px;max-width:100%;border-radius:6px}
.vt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.vt-item{position:relative;cursor:pointer;text-align:center;font-size:.78rem;color:var(--mute)}
.vt-item input{position:absolute;opacity:0}
.vt-item img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:8px;border:2px solid transparent;background:#fff;display:block}
.vt-item input:checked+img{border-color:var(--ac)}
.vt-item input:focus-visible+img{outline:2px solid #fff}
.vt-item span{display:block;margin-top:4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.vt-go{background:var(--ac);color:#1a1006;border:0;border-radius:8px;padding:13px 20px;font-weight:700;font-size:1rem;cursor:pointer}
.vt-go:disabled{opacity:.6;cursor:wait}
.vt-status{min-height:1.2em;color:var(--mute);font-size:.9rem}
.vt-status.vt-err{color:#ff8f8f}
.vt-cmp{position:relative;direction:ltr;aspect-ratio:3/4;max-width:460px;margin:0 auto;border-radius:10px;overflow:hidden;background:#fff;--p:50%}
.vt-cmp img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}
.vt-bw{position:absolute;inset:0;background:#fff;clip-path:inset(0 calc(100% - var(--p)) 0 0)}
.vt-cmp input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.vt-cmp::after{content:"";position:absolute;top:0;bottom:0;left:var(--p);width:3px;background:var(--ac);pointer-events:none}
.vt-tag{position:absolute;top:10px;background:rgba(0,0,0,.65);color:#fff;font-size:.75rem;padding:3px 9px;border-radius:5px;pointer-events:none}
.vt-tag-b{left:10px}.vt-tag-a{right:10px}
.vt-dl{display:block;width:max-content;margin:12px auto 0;color:var(--ac)}
.vt-note,.vt-hint{margin:0;font-size:.8rem;color:var(--mute)}
.vt-open{margin-inline-start:8px}
.vt-modal{display:none;position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.7);overflow:auto;padding:16px}
.vt-modal.open{display:block}
.vt-box{position:relative;max-width:900px;margin:auto}
.vt-close{position:absolute;top:8px;left:8px;z-index:2;background:#fff;color:#000;border:0;border-radius:50%;width:34px;height:34px;font-size:22px;line-height:1;cursor:pointer}
@media (prefers-reduced-motion:no-preference){.vt-item img{transition:border-color .15s}}

.vt-search{width:100%;box-sizing:border-box;margin:0 0 12px;padding:11px 14px;background:#16161c;color:var(--ink);border:1px solid #4a4a58;border-radius:8px;font:inherit}
.vt-search:focus{outline:none;border-color:var(--ac)}
.vt-search::placeholder{color:var(--mute)}