:root {
  --bg: #fffaf3; --fg: #2b1d12; --muted: #7a6a5c; --card: #fff; --line: #eadfd2;
  --accent: #c8341b; --accent-fg: #fff;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, sans-serif; background: var(--bg); color: var(--fg); }
a { color: var(--accent); }
.topbar { display: flex; justify-content: space-between; align-items: center;
  padding: 14px 16px; background: var(--card); border-bottom: 1px solid var(--line); }
.brand { font-weight: 700; text-decoration: none; color: var(--fg); }
.cart-link { text-decoration: none; font-weight: 600; }
.badge { display: inline-block; min-width: 22px; padding: 1px 7px; border-radius: 11px;
  background: var(--accent); color: var(--accent-fg); text-align: center; font-size: .85em; }
.container { max-width: 860px; margin: 24px auto; padding: 0 16px; }
.muted { color: var(--muted); }
.product { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; background: var(--card);
  border: 1px solid var(--line); border-radius: 14px; padding: 24px; }
.product img { width: 100%; border-radius: 10px; }
.price { font-size: 1.8rem; font-weight: 700; }
.btn { background: var(--accent); color: var(--accent-fg); border: 0; border-radius: 8px;
  padding: 12px 20px; font-size: 1rem; font-weight: 600; cursor: pointer; }
.btn-sm { width: 32px; height: 32px; border: 1px solid var(--line); background: var(--card);
  border-radius: 6px; font-size: 1.1rem; cursor: pointer; }
.line { display: flex; align-items: center; gap: 14px; background: var(--card);
  border: 1px solid var(--line); border-radius: 12px; padding: 14px; }
.line img { width: 72px; height: 72px; border-radius: 8px; }
.grow { flex: 1; }
.qty { display: flex; align-items: center; gap: 10px; }
.subtotal { min-width: 90px; text-align: right; font-weight: 600; }
.total { display: flex; justify-content: space-between; font-size: 1.3rem; font-weight: 700;
  padding: 18px 14px; }
#checkout { margin-top: 8px; }
@media (max-width: 640px) {
  .product { grid-template-columns: 1fr; }
  .line { flex-wrap: wrap; }
}
