.category-screen { background:#e6e9e7; }
.category-page {
  width: min(100%, 430px);
  min-height: 100vh;
  margin: 0 auto;
  padding: 24px 18px 112px;
  background: #fff;
}
.category-header { display:flex; align-items:center; justify-content:space-between; }
.category-header span { display:block; margin-bottom:4px; color:#84908a; font-size:10px; font-weight:700; }
.category-header h1 { margin:0; color:#222a25; font-size:25px; letter-spacing:-.035em; }
.category-header > a { display:grid; place-items:center; width:40px; height:40px; border:1px solid #e5e9e6; border-radius:50%; color:#415149; }
.category-header svg { width:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }
.category-selector { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:24px; }
.category-selector button {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:0 14px;
  border:1px solid #e5e9e6;
  border-radius:11px;
  background:#fafbfa;
  color:#536059;
  text-align:center;
}
.category-selector button:hover { border-color:#bdcbc4; }
.category-selector button.is-active { border-color:var(--deep-green); background:var(--deep-green); color:#fff; }
.category-selector strong { font-size:12px; font-weight:750; }
.category-products { margin-top:30px; }
.category-products > header { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:14px; padding-bottom:11px; border-bottom:1px solid #ecefed; }
.category-products > header span { color:#8b9590; font-size:9px; font-weight:700; }
.category-products h2 { margin:4px 0 0; color:#252c28; font-size:18px; letter-spacing:-.025em; }
.category-sort { display:flex; align-items:center; flex:0 0 auto; padding:3px; border-radius:8px; background:#f2f4f3; }
.category-sort button { min-width:48px; height:28px; padding:0 8px; border:0; border-radius:6px; background:transparent; color:#8a938e; font-size:9px; font-weight:700; }
.category-sort button.is-active { background:#fff; color:#2e4439; box-shadow:0 1px 4px rgba(39,55,47,.09); }
.category-product-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 10px; }
.category-screen .popular-card { min-width:0; overflow:hidden; cursor:pointer; }
.category-screen .popular-thumb { position:relative; width:100%; aspect-ratio:1/1.08; margin-bottom:9px; overflow:hidden; border-radius:10px; background:#f0f3f1; }
.category-screen .popular-thumb img { width:100%; height:100%; object-fit:cover; }
.category-screen .popular-thumb button { position:absolute; right:7px; bottom:7px; z-index:2; display:grid; place-items:center; width:31px; height:31px; border-radius:50%; background:rgba(255,255,255,.92); font-size:18px; }
.category-screen .popular-badges {
  position:absolute;
  left:0;
  top:auto;
  bottom:0;
  z-index:2;
  display:flex;
  gap:2px;
  max-width:calc(100% - 42px);
}
.category-screen .popular-badge {
  padding:4px 7px;
  border-radius:0 4px 0 0;
  background:#536b60;
  color:#fff;
  font-size:8px;
  font-weight:750;
  line-height:1.15;
  letter-spacing:-.02em;
}
.category-screen .popular-badge + .popular-badge { border-radius:4px 4px 0 0; }
.category-screen .popular-badge.deadline { background:#111111 !important; }
.category-screen .popular-badge.urgent { background:#bd2832 !important; }
.category-screen .popular-badge.popular { background:#0f4c3a !important; }
.category-screen .popular-badge.muted { background:#77817c !important; }
.category-screen .popular-card > strong { display:block; overflow:hidden; color:#303733; font-size:12px; line-height:1.4; text-overflow:ellipsis; white-space:nowrap; }
.category-screen .popular-card > p { margin:5px 0 4px; color:#252b27; font-size:14px; font-weight:800; }
.category-screen .popular-card del { margin-left:5px; color:#a0a8a4; font-size:10px; font-weight:500; }
.category-screen .popular-card > small { display:block; overflow:hidden; color:#8c9590; font-size:9px; line-height:1.4; text-overflow:ellipsis; white-space:nowrap; }
.category-screen .popular-card-meta { display:flex; flex-direction:column; gap:2px; margin-top:5px; color:#919a95; font-size:8px; }
.category-screen .popular-card.is-sold-out .popular-thumb img { filter:grayscale(.8) brightness(.72); }
.category-screen .popular-card.is-sold-out .popular-badges {
  inset:0;
  max-width:none;
  align-items:center;
  justify-content:center;
  background:rgba(28,33,30,.18);
}
.category-screen .popular-card.is-sold-out .popular-badge {
  padding:0;
  border-radius:0;
  background:transparent !important;
  font-size:13px;
  text-shadow:0 1px 5px rgba(0,0,0,.25);
}
.category-empty { grid-column:1/-1; padding:54px 15px; color:#87918c; text-align:center; }
.category-empty strong { display:block; margin-bottom:7px; color:#58645e; font-size:13px; }
.category-empty p { margin:0; font-size:10px; }