:root{
  --bg: #ffffff;
  --text: #111827;
  --card: #f3f4f6;
}
[data-theme="dark"]{
  --bg: #0b1220;
  --text: #e6eef8;
  --card: #0f1724;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,"Noto Sans","Helvetica Neue",Arial;
  background:var(--bg);
  color:var(--text);
}
header{
  display:flex;
  gap:1rem;
  padding:1rem;
  align-items:center;
  background:var(--card);
}
main{display:flex;gap:1rem;padding:1rem}
#products{flex:2;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.product{background:var(--card);padding:1rem;border-radius:6px}
.product img{max-width:100%;height:140px;object-fit:cover}
#cart{width:320px;background:var(--card);padding:1rem;border-radius:6px}
label{display:block;margin:0.5rem 0}
button{cursor:pointer}