/* TB Blog Browser - interaktive Blog-Uebersicht */
.tb-blogbrowser{ --bb-ink:#1b1f2a; --bb-mut:#6b7280; --bb-line:#e6e8ef; --bb-card:#fff; --bb-brand:#1919c8; --bb-soft:#f6f7fb; }
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .tb-blogbrowser{ --bb-ink:#e8eaf2; --bb-mut:#9aa1b4; --bb-line:#2a2f3d; --bb-card:#161a24; --bb-soft:#12151d; --bb-brand:#8ea2ff; } }

.tb-bb__boot,.tb-bb__empty{ color:var(--bb-mut); padding:24px 0; }
.tb-bb__bar{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin:8px 0 6px; }
.tb-bb__search{ position:relative; display:flex; align-items:center; gap:8px; flex:1 1 260px; min-width:0; padding:0 12px; border:1px solid var(--bb-line); border-radius:999px; background:var(--bb-card); color:var(--bb-mut); }
.tb-bb__search-in{ flex:1 1 auto; min-width:0; border:none; background:transparent; color:var(--bb-ink); font:inherit; padding:11px 0; outline:none; }
.tb-bb__sel{ appearance:none; border:1px solid var(--bb-line); border-radius:999px; background:var(--bb-card); color:var(--bb-ink); font:inherit; padding:10px 34px 10px 15px; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 12px center; }
.tb-bb__count{ color:var(--bb-mut); font-size:.92rem; margin:4px 0 16px; }

.tb-bb__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:26px; }
@media (max-width:720px){ .tb-bb__grid{ grid-template-columns:1fr; } }

.tb-bb__card{ display:flex; flex-direction:column; }
.tb-bb__imglink{ display:block; }
.tb-bb__img{ width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:10px; display:block; background:var(--bb-soft); }
.tb-bb__meta{ display:flex; align-items:center; gap:10px; margin:12px 0 4px; font-size:.82rem; color:var(--bb-mut); }
.tb-bb__cat{ font-weight:700; color:var(--bb-brand); text-transform:uppercase; letter-spacing:.04em; font-size:.74rem; }
.tb-bb__title{ margin:2px 0 6px; font-size:1.4rem; line-height:1.25; }
.tb-bb__title a{ color:var(--bb-ink); text-decoration:none; }
.tb-bb__title a:hover{ text-decoration:underline; }
.tb-bb__excerpt{ color:var(--bb-mut); margin:0 0 10px; }
.tb-bb__read{ color:var(--bb-brand); text-decoration:none; font-weight:600; font-size:.95rem; margin-top:auto; }
.tb-bb__read:hover{ text-decoration:underline; }

.tb-bb__more{ display:block; margin:30px auto 0; padding:12px 24px; border:1px solid var(--bb-line); border-radius:999px; background:var(--bb-card); color:var(--bb-ink); font:inherit; font-weight:600; cursor:pointer; }
.tb-bb__more:hover{ background:var(--bb-soft); }