:root{--accent:#0b84ff;--muted:#8b98a6}
*{box-sizing:border-box}
body{font-family:system-ui,Arial;margin:0;background:#070708;color:#fff}
.topbar{display:flex;align-items:center;gap:12px;padding:12px;background:#0b0b0d;border-bottom:1px solid #111;position:sticky;top:0;z-index:60}
.brand{font-weight:700}
.container{max-width:980px;margin:12px auto;padding:12px}

/* IMPORTANT: grid default 2 columns, 1 column only on very small screens */
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media (max-width:600px){ .grid{grid-template-columns:repeat(1,1fr)} }

/* Cards */
.card-link{display:block;text-decoration:none;color:inherit}
.card{background:#0f1113;border-radius:12px;padding:10px;border:1px solid rgba(255,255,255,0.04);display:flex;flex-direction:column;gap:10px}
.thumb{width:100%;height:180px;object-fit:cover;border-radius:8px}
.title{font-weight:700;font-size:16px;margin-top:6px;color:#fff}
.pills{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.pill{background:#17181a;padding:8px 12px;border-radius:12px;color:#fff;display:flex;justify-content:space-between;min-width:120px}
.sectionTitle{color:#9aa2ac;margin:12px 0 8px 0}
.muted{color:#9aa2ac}

/* Detail page overrides kept in detail.html inline style as before */

/* Ensure images are block and don't cause column collapse */
img{display:block;max-width:100%}