.kbt-widget{
  --kbt-bg:#0b1220; --kbt-card:#0f172a; --kbt-text:#b6b6b6; --kbt-muted:#94a3b8; --kbt-border:rgba(148,163,184,.18);
  --kbt-btn:rgba(148,163,184,.10); --kbt-btn-border:rgba(148,163,184,.22);
  --kbt-primary:rgba(23, 93, 206, 0.986);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--kbt-text);
}
.kbt-widget[data-kbt-theme="light"]{
  --kbt-bg:#f7fafc; --kbt-card:#ffffff; --kbt-text:#0f172a; --kbt-muted:#475569; --kbt-border:rgba(15,23,42,.12);
  --kbt-btn:rgba(15,23,42,.06); --kbt-btn-border:rgba(15,23,42,.14);
}
.kbt-widget *{ box-sizing:border-box; }
.kbt-widget a{ color: inherit; text-decoration:none; }
.kbt-widget a:hover{ text-decoration: underline; }

.kbt-topbar{
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  background: var(--kbt-bg);
  border:1px solid var(--kbt-border);
  border-radius:16px;
  padding:14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
}
.kbt-h1{ font-weight:800; font-size:20px; line-height:1.15; }
.kbt-sub{ margin-top:6px; color: var(--kbt-muted); font-size:12.5px; }
.kbt-actions{ display:flex; gap:8px; align-items:center; }

.kbt-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 12px; border-radius:12px;
  background: var(--kbt-primary);
  color:#fff !important; font-weight:700; font-size:13px;
  border:1px solid rgba(255,255,255,.10);
  cursor:pointer;
  text-decoration: none !important;
}
.kbt-btn-ghost{
  background: var(--kbt-btn);
  border:1px solid var(--kbt-btn-border);
  color: var(--kbt-text) !important;
  font-weight:700;
}
.kbt-btn:hover{ filter: brightness(1.02); text-decoration:none; }

.kbt-filters{
  margin-top:12px;
  display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end;
  background: var(--kbt-bg);
  border:1px solid var(--kbt-border);
  border-radius:16px;
  padding:12px;
}
.kbt-filters label{ display:flex; flex-direction:column; gap:6px; font-size:12px; color: var(--kbt-muted); }
.kbt-filters input, .kbt-filters select{
  min-width: 220px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--kbt-btn-border);
  background: transparent;
  color: var(--kbt-text);
  height:40px;
}
.kbt-filter-actions{ display:flex; gap:8px; }

.kbt-section{ margin-top:14px; }
.kbt-sec-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 2px; }
.kbt-sec-title{ font-weight:800; font-size:16px; }
.kbt-sec-meta{ color: var(--kbt-muted); font-size:12px; }

.kbt-card{
  background: var(--kbt-card);
  border:1px solid var(--kbt-border);
  border-radius:16px;
  padding:14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.10);
}
.kbt-muted{ color: var(--kbt-muted); }
.kbt-error{ border-color: rgba(239,68,68,.35); background: rgba(239,68,68,.08); }

.kbt-grid{ display:grid; gap:12px; margin-top:10px; }
.kbt-grid-4{ grid-template-columns: repeat(4, minmax(0,1fr)); }
@media (max-width: 1100px){ .kbt-grid-4{ grid-template-columns: repeat(3, 1fr);} }
@media (max-width: 820px){ .kbt-grid-4{ grid-template-columns: repeat(2, 1fr);} }
@media (max-width: 520px){ .kbt-grid-4{ grid-template-columns: 1fr;} .kbt-filters input, .kbt-filters select{ min-width: 100%; } }

.kbt-vcard{ padding:0; overflow:hidden; }
.kbt-thumb{ aspect-ratio: 16/9; background: rgba(59,130,246,.12); border-bottom:1px solid var(--kbt-border); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.kbt-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.kbt-thumb-fallback{ font-size:44px; opacity:.9; }
.kbt-vbody{ padding:12px 14px; }
.kbt-vtitle{ font-weight:800; font-size:14px; line-height:1.25; }
.kbt-vmeta{ margin-top:6px; color: var(--kbt-muted); font-size:12px; }

.kbt-tests-mini{ margin-top:10px; display:flex; gap:6px; flex-wrap:wrap; }
.kbt-pill{ display:inline-flex; align-items:center; padding:4px 8px; border-radius:999px; border:1px solid var(--kbt-border); font-size:11.5px; background: rgba(148,163,184,.08); }
.kbt-pill-muted{ opacity:.75; }

.kbt-list{ margin-top:10px; display:flex; flex-direction:column; gap:10px; }
.kbt-row{ display:flex; gap:12px; align-items:flex-start; justify-content:space-between; }
.kbt-row-body{ display:flex; gap:12px; align-items:flex-start; min-width:0; flex:1; }
.kbt-row-thumb{ width:168px; aspect-ratio:16/9; flex:0 0 168px; border-radius:10px; overflow:hidden; background:rgba(59,130,246,.12); border:1px solid var(--kbt-border); display:block; }
.kbt-row-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.kbt-row-main{ flex:1; }
.kbt-row-title{ font-weight:800; font-size:14px; }
.kbt-row-meta{ margin-top:6px; font-size:12px; color: var(--kbt-muted); display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.kbt-dot{ opacity:.8; }
.kbt-row-actions{ display:flex; gap:8px; align-items:center; }
@media (max-width: 640px){
  .kbt-row{ flex-direction:column; }
  .kbt-row-body{ width:100%; }
  .kbt-row-thumb{ width:140px; flex-basis:140px; }
  .kbt-row-actions{ width:100%; justify-content:flex-end; }
}
@media (max-width: 420px){
  .kbt-row-body{ flex-direction:column; }
  .kbt-row-thumb{ width:100%; flex-basis:auto; }
}

.kbt-pager{ margin-top:10px; display:flex; gap:10px; align-items:center; justify-content:flex-end; padding-right:2px; }

.kbt-detail-thumb{ margin-top:12px; border-radius:14px; overflow:hidden; border:1px solid var(--kbt-border); background:rgba(59,130,246,.12); }
.kbt-detail-thumb img{ width:100%; aspect-ratio:16/9; max-height:420px; object-fit:cover; display:block; }

.kbt-embed{ position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; border-radius:12px; border:1px solid var(--kbt-border); background: rgba(0,0,0,.2); }
.kbt-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.kbt-download{ display:flex; align-items:center; justify-content:center; padding:18px; }