/* Responsive grid & UI */
.vtm-list { max-width: 1200px; margin: 0 auto; padding: 8px; }
.vtm-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
@media (max-width: 1024px) { .vtm-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .vtm-grid { grid-template-columns: 1fr; } }

.vtm-card { border:1px solid #e2e8f0; border-radius:12px; padding:12px; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,0.06); display:flex; flex-direction:column; }
.vtm-player { margin-bottom:10px; overflow:hidden; border-radius:10px; }
.vtm-section h4 { margin:6px 0 10px; }
.vtm-form { display:flex; flex-direction:column; gap:10px; }
.vtm-input { padding:10px; border:2px solid #cbd5e1; border-radius:8px; font-size:14px; width:100%; transition:border .2s; }
.vtm-input:focus { outline:none; border-color:#2563eb; }
.vtm-meta { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; }
.vtm-counter { font-weight:bold; font-size:12px; color:red; }
.vtm-btn { padding:8px 14px; border:0; border-radius:8px; background:#111827; color:#fff; cursor:not-allowed; opacity:.6; transition:all .2s; font-size:14px; }
.vtm-btn.enabled { cursor:pointer; opacity:1; background:#2563eb; }
.vtm-msg { min-height:18px; font-size:12px; }
.vtm-titles { list-style:none; padding:0; margin:10px 0 0; display:flex; flex-direction:column; gap:8px; }
.vtm-title { display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; border:1px solid #e5e7eb; padding:8px; border-radius:8px; }
.vtm-title-text { flex:1; min-width:120px; font-size:14px; }
.vtm-votes { font-size:12px; font-weight:bold; }
.vtm-upvote { padding:6px 10px; border:0; border-radius:8px; background:#16a34a; color:#fff; cursor:pointer; font-size:13px; }
.vtm-upvote[disabled] { background:#9ca3af; cursor:not-allowed; }
.vtm-empty, .vtm-info { font-size:12px; color:#6b7280; }
.vtm-id { font-size:12px; color:#374151; margin:2px 0 8px; opacity:0.8; }

.vtm-pagination { display:flex; gap:8px; list-style:none; padding:0; justify-content:center; margin:18px 0; }
.vtm-pagination li a { display:block; padding:8px 12px; border:1px solid #e5e7eb; border-radius:8px; text-decoration:none; }
.vtm-pagination li.active a, .vtm-pagination li a:hover { background:#111827; color:#fff; border-color:#111827; }

/* Admin */
.vtm-admin-search { margin: 10px 0 12px; text-align:right; }
.vtm-admin-search input[type="search"]{ min-width: 280px; padding:6px 10px; }
.vtm-admin-titles { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.vtm-admin-titles .vtm-badge { margin-left:6px; font-size:12px; opacity:.75; }
