:root{--sg-primary:#091b2f; --sg-accent:#f27800; --sg-pin: var(--sg-accent);}
.sg-wrapper { --gap: 16px; color: var(--sg-primary); }
.sg-search { display:flex; flex-wrap:wrap; gap: var(--gap); margin-bottom: var(--gap); align-items:center; }
.sg-search select { min-width:160px; padding:10px; border:1px solid #ddd; border-radius:10px; }
.sg-search button { padding:10px 14px; border-radius:10px; border:1px solid #ddd; background:#fff; cursor:pointer; color: var(--sg-primary); }
.sg-heat { display:flex; align-items:center; gap:6px; padding:8px 10px; border:1px solid #ddd; border-radius:10px; background:#fafafa; color: var(--sg-primary); }
#sg-map { border-radius: 12px; overflow:hidden; margin-bottom: var(--gap); }
.sg-feed { display:flex; flex-direction:column; gap: var(--gap); }
.sg-card { display:flex; gap:12px; border:1px solid #eee; border-radius:14px; background:#fff; overflow:hidden; }
.sg-card-media { width: 320px; max-width: 42vw; }
.sg-card-media img { width:100%; height:200px; object-fit:cover; display:block; background:#f2f2f2; }
.sg-card-body { padding:12px; display:flex; flex-direction:column; gap:8px; flex:1; }
.sg-title { margin:0; font-size: 18px; }
.sg-title a { color: var(--sg-primary); text-decoration:none; }
.sg-title a:hover { color: var(--sg-accent); }
.sg-subtitle { color:#54657a; font-size: 13px; }
.sg-meta { font-size: 12px; color:#778399; }
.sg-pagination { display:flex; gap:8px; justify-content:center; margin: 18px 0; }
.sg-pagination a { border:1px solid #ddd; padding:6px 10px; border-radius:8px; text-decoration:none; color: var(--sg-primary); }
.sg-pagination a.active { background: var(--sg-primary); color:#fff; border-color: var(--sg-primary); }
.sg-empty { text-align:center; padding:30px; color:#666; }
.sg-debug { background:#fff5f5; color:#900; border:1px solid #f3c2c2; border-radius:12px; padding:10px; margin:10px 0; font-size:12px; }
@media (max-width: 680px){ .sg-card { flex-direction:column; } .sg-card-media { width:100%; max-width:none; } .sg-card-media img { height:220px; } }