
.texhead { display:flex; flex-wrap:wrap; gap:10px 18px; align-items:end; background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:10px 14px; margin:0 0 16px; position:sticky; top:0; z-index:5; }
.texhead label { font-size:13px; color:var(--muted); display:flex; flex-direction:column; gap:3px; }
.texhead input { width:110px; padding:6px 8px; border-radius:6px; border:1px solid var(--line); background:var(--bg); color:var(--text); font:inherit; }
.texhead p { margin:0; font-size:13px; color:var(--muted); flex:1 1 260px; }
.texs { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:12px; }
.texs .tx { cursor:pointer; }
.tx { background:var(--panel); border:1px solid var(--line); border-radius:10px; overflow:hidden; scroll-margin-top:90px; }
.tx:target { border-color:var(--accent2); box-shadow:0 0 0 2px var(--accent); }
.tx .img { aspect-ratio:1; display:flex; align-items:center; justify-content:center;
  background:repeating-conic-gradient(#2c2540 0% 25%, #1f1a2b 0% 50%) 50% / 20px 20px; }
.tx .img img { max-width:100%; max-height:100%; image-rendering:auto; }
.tx .b { padding:8px 10px 10px; }
.tx h3 { margin:0; font-size:15px; word-break:break-all; }
.tx .sz { color:var(--muted); font-size:12px; }
.tx .btns { display:flex; flex-wrap:wrap; gap:5px; margin-top:7px; }
.tx button, .tx a.dl { font:inherit; font-size:12px; padding:4px 8px; border-radius:6px; border:1px solid var(--line); background:var(--bg); color:var(--text); cursor:pointer; text-decoration:none; }
.tx button:hover, .tx a.dl:hover { border-color:var(--accent2); }
.tx .none { font-size:12px; color:var(--muted); margin-top:6px; }
.favstar { font:inherit; cursor:pointer; }
.favstar span { color:#c9c0e0; }
.favstar.on span { color:#ffcf4d; }

.search { display:flex; gap:8px; margin:8px 0 14px; max-width:700px; }
.search input { flex:1; padding:10px 12px; border-radius:8px; border:1px solid var(--line); background:var(--panel); color:var(--text); font:inherit; }
.txl { columns:4 200px; font-size:14px; }
/* the filters (owner, 2026-10-29: "categories and other ways to filter through the textures"), as the skins page's bar */
.bar { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:6px 0 10px; }
.bar input[type=search], .bar select { padding:8px 10px; border-radius:8px; border:1px solid var(--line); background:var(--bg); color:var(--text); font:inherit; }
.bar input[type=search] { flex:1 1 260px; }
.bar label.ck { display:flex; align-items:center; gap:5px; color:var(--muted); font-size:14px; cursor:pointer; }
.count { color:var(--muted); font-size:13px; }
.chips { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 14px; }
.chips button { font:inherit; font-size:13px; padding:4px 10px; border-radius:999px; border:1px solid var(--line); background:var(--panel); color:var(--text); cursor:pointer; }
.chips button.on, .chips button:hover { border-color:var(--accent2); color:#fff; }
.chips button small { color:var(--muted); }
.more { display:block; margin:14px auto; font:inherit; padding:8px 18px; border-radius:8px; border:1px solid var(--line); background:var(--panel); color:var(--text); cursor:pointer; }
.texs.medium { grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); }
.texs.small { grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:8px; } .texs.small .tx .b { padding:5px 6px 6px; } .texs.small .tx h3 { font-size:12px; } .texs.small .tx .btns { display:none; }
.texs.tiny { grid-template-columns:repeat(auto-fill,minmax(78px,1fr)); gap:5px; } .texs.tiny .tx .b { display:none; }
@media (max-width: 600px) { .texs { grid-template-columns:repeat(2,minmax(0,1fr)); } .texs.medium { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .texs.small { grid-template-columns:repeat(4,minmax(0,1fr)); } .texs.tiny { grid-template-columns:repeat(5,minmax(0,1fr)); } }
.txl a { display:block; padding:1px 0; }
.txl small { color:var(--muted); }
