.trnd-wrap{max-width:1200px;margin:0 auto;padding:20px 20px 60px}
.trnd-header{display:flex;align-items:center;gap:16px;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--brd)}
.trnd-back{background:transparent;border:1px solid var(--brd);color:var(--tx2);border-radius:8px;padding:8px 16px;cursor:pointer;font-size:13px}
.trnd-back:hover{border-color:var(--acc);color:var(--acc)}
.trnd-header h2{font-size:18px;font-weight:700;color:var(--tx1);margin:0;flex:1}
.trnd-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.trnd-filter{background:var(--p1);border:1px solid var(--brd);color:var(--tx2);border-radius:20px;padding:5px 14px;cursor:pointer;font-size:12px;font-weight:500;transition:all .15s}
.trnd-filter.on{background:var(--acc);border-color:var(--acc);color:#fff}
.trnd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.trnd-card{background:var(--p1);border:1px solid var(--brd);border-radius:12px;overflow:hidden;cursor:pointer;transition:transform .15s,border-color .15s,box-shadow .15s}
.trnd-card:hover{transform:translateY(-3px);border-color:rgba(107,63,160,.5);box-shadow:0 8px 24px rgba(0,0,0,.2)}
.trnd-card-thumb{width:100%;aspect-ratio:16/9;position:relative;overflow:hidden;background:var(--p2)}
.trnd-card-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.trnd-card:hover .trnd-card-thumb img{transform:scale(1.05)}
.trnd-card-dur{position:absolute;bottom:6px;right:6px;background:rgba(0,0,0,.8);color:#fff;font-size:10px;font-weight:600;padding:2px 5px;border-radius:4px}
.trnd-card-sw{position:absolute;top:8px;left:8px;background:rgba(107,63,160,.85);color:#fff;font-size:9px;font-weight:700;padding:2px 6px;border-radius:4px;text-transform:uppercase}
.trnd-card-body{padding:12px 14px}
.trnd-card-title{font-size:13px;font-weight:600;color:var(--tx1);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 6px}
.trnd-card-meta{font-size:11px;color:var(--tx3);display:flex;justify-content:space-between}
@media(max-width:600px){.trnd-grid{grid-template-columns:repeat(2,1fr);gap:10px}.trnd-wrap{padding:12px 12px 48px}}

/* -- Settings -- */
#pg-settings{background:var(--bg)}
.set-wrap{max-width:680px;margin:0 auto;padding:28px 24px 80px}
.set-header{display:flex;align-items:center;gap:14px;margin-bottom:28px;padding-bottom:16px;border-bottom:1px solid var(--brd)}
.set-back{background:transparent;border:1px solid var(--brd);color:var(--tx2);border-radius:8px;padding:7px 14px;cursor:pointer;font-size:13px}
.set-back:hover{border-color:var(--acc);color:var(--acc)}
.set-header h2{font-size:18px;font-weight:700;color:var(--tx1);margin:0;flex:1}
.set-section{background:var(--p1);border:1px solid var(--brd);border-radius:14px;padding:22px 24px;margin-bottom:18px}
.set-section-title{font-size:13px;font-weight:700;color:var(--acc);text-transform:uppercase;letter-spacing:.6px;margin:0 0 16px}
.set-save-btn{background:var(--acc);color:#fff;border:none;border-radius:10px;padding:11px 28px;font-size:14px;font-weight:600;cursor:pointer;transition:opacity .15s;width:100%;margin-top:8px}
.set-save-btn:hover{opacity:.88}
/* reuse onb styles for chips/grid inside settings */
#pg-settings .onb-opts,#pg-settings .onb-multi{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
#pg-settings .onb-q{font-size:13px;font-weight:600;color:var(--tx1);margin:0 0 4px}
#pg-settings .onb-hint{font-size:11px;color:var(--tx3);margin:0 0 8px}
#pg-settings .onb-sw-grid{max-height:300px;margin-top:10px}
