
:root {
  --bg:#0f1115; --panel:#151823; --text:#eaecef; --muted:#b7bcc8; --brand:#7fb4ff;
  --card:#ffffff; --shadow:0 10px 30px rgba(0,0,0,.30);
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; background:var(--bg); color:var(--text); font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, sans-serif; }
a { color: var(--brand); text-decoration: none; }
a:hover { text-decoration: underline; }
.container { max-width: 1200px; margin: 0 auto; padding: 24px; }
.header { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom: 18px; }
.brand { display:flex; align-items:center; gap:12px; }
.brand .logo { width:42px; height:42px; border-radius:10px; background:#1d2230; display:inline-flex; align-items:center; justify-content:center; }
.brand h1 { margin:0; font-size:22px; letter-spacing:.3px; }
.grid { display:grid; grid-template-columns: 1fr 340px; gap:24px; }
@media (max-width: 900px) { .grid { grid-template-columns: 1fr; } }
.panel { background:var(--panel); border-radius:14px; padding:18px; box-shadow: var(--shadow); }
.post { background:#fff; color:#111; border-radius:12px; overflow:hidden; box-shadow: var(--shadow); margin-bottom:18px; }
.post header { padding:14px 16px 0; }
.post h2 { margin:0 0 6px; font-size:20px; }
.post .meta { color:#6b7280; font-size:12px; padding:0 16px 8px; }
.post .content { padding: 0 0 12px; }
.post img { display:block; width:100%; height:auto; }
.shop .item { background:#fff; border-radius:12px; overflow:hidden; box-shadow: var(--shadow); margin-bottom:16px; }
.item .thumb { width:100%; aspect-ratio: 4/3; object-fit: cover; display:block; }
.item .body { color:#111; padding:12px; }
.badge { border:1px solid #2a2f3a; color:var(--muted); border-radius:999px; padding:4px 10px; font-size:12px; display:inline-block; }
.price { font-weight:700; }
.footer { color:var(--muted); margin-top: 20px; text-align:center; font-size:12px; }
.cart-btn { display:inline-block; background:#111; color:#fff; border-radius:10px; padding:10px 12px; margin-top:8px; }
.search { width:100%; padding:10px 12px; border-radius:10px; border:none; background:#1d2230; color:#fff; }
.section-title { margin:0 0 12px; font-size:16px; color:#fff; }
