/* HB User Portal - lightweight Netflix-style dashboard */

.hb-row{margin:18px 0}
.hb-row-head{display:flex;align-items:center;justify-content:space-between;margin:0 0 10px}
.hb-row-title{font-size:18px;font-weight:900;margin:0}
.hb-pill{font-size:12px;font-weight:800;opacity:.85;border:1px solid rgba(255,255,255,.14);padding:4px 10px;border-radius:999px}

.hb-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (min-width:720px){.hb-grid{grid-template-columns:repeat(4,minmax(0,1fr));}}
@media (min-width:1100px){.hb-grid{grid-template-columns:repeat(6,minmax(0,1fr));}}

.hb-card{display:block;text-decoration:none;border-radius:16px;overflow:hidden;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}
.hb-thumb{position:relative;width:100%;aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hb-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.hb-meta{padding:10px 10px 12px}
.hb-title{font-weight:900;font-size:14px;line-height:1.2;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

.hb-fav-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.25);color:inherit;border-radius:999px;padding:8px 12px;font-weight:900;cursor:pointer}
.hb-fav-btn[aria-pressed="true"]{background:rgba(255,255,255,.14)}
.hb-fav-msg{margin-left:10px;font-size:12px;opacity:.8}

.hb-gate{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);border-radius:18px;padding:16px}
.hb-gate-title{font-size:20px;font-weight:1000;margin:0 0 6px}
.hb-gate-sub{opacity:.85;margin:0 0 14px}
.hb-gate-actions{display:flex;gap:10px;flex-wrap:wrap}
.hb-btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:12px;font-weight:1000;text-decoration:none;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.25);color:inherit}
.hb-btn.hb-btn-primary{background:rgba(255,255,255,.14)}

.hb-dash-head{margin:0 0 14px}
.hb-dash-title{font-size:24px;font-weight:1000;margin:0 0 4px}
.hb-dash-sub{opacity:.85}
.hb-section{margin:18px 0}
.hb-section-title{font-size:18px;font-weight:1000;margin:0 0 10px}
.hb-empty{opacity:.85;padding:12px;border:1px dashed rgba(255,255,255,.18);border-radius:14px}
.hb-badge{position:absolute;top:10px;left:10px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.22);padding:4px 8px;border-radius:999px;font-size:12px;font-weight:1000}