:root{
  --bg:#0f0f10; --panel:#17171a; --tile:#f4f4f5;
  --text:#f4f4f5; --muted:#9a9aa2; --accent:#22c55e; --line:#26262b;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  background:var(--bg); color:var(--text);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  line-height:1.5;
}
.wrap{width:100%;max-width:1080px;margin:0 auto;padding:0 1.25rem}

/* Header */
.site-header{border-bottom:1px solid var(--line);padding:1.5rem 0}
.header-inner{display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap}
.brand{font-size:1.6rem;font-weight:800;letter-spacing:-.02em;color:var(--text);text-decoration:none}
.dot{color:var(--accent)}
.tagline{margin:0;color:var(--muted);font-size:.95rem}

/* Section */
.section-title{font-size:1.4rem;font-weight:700;margin:2rem 0 1.25rem}

/* Grid of tees */
.grid{
  display:grid;gap:1.25rem;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  padding-bottom:2rem;
}
.card{
  background:var(--panel);border:1px solid var(--line);border-radius:14px;
  overflow:hidden;display:flex;flex-direction:column;
}
.card .thumb{
  aspect-ratio:1/1;background:var(--tile);
  display:flex;align-items:center;justify-content:center;padding:1rem;
}
.card .thumb img{max-width:100%;max-height:100%;object-fit:contain}
.card .body{padding:.9rem 1rem 1.1rem;display:flex;flex-direction:column;gap:.35rem}
.card .name{font-weight:700;font-size:1.02rem;margin:0}
.card .tag{color:var(--muted);font-size:.82rem}
.card .row{display:flex;align-items:center;justify-content:space-between;margin-top:.4rem}
.card .price{font-weight:700}
.card .btn{
  background:#000;color:#fff;border:1px solid var(--line);
  border-radius:999px;padding:.4rem .8rem;font-size:.82rem;cursor:not-allowed;opacity:.7;
}
.muted{color:var(--muted)}

/* Footer */
.site-footer{border-top:1px solid var(--line);padding:1.5rem 0;margin-top:1rem}