:root{
  --bg: var(--tg-theme-bg-color, #ffffff);
  --sec-bg: var(--tg-theme-secondary-bg-color, #f2f3f5);
  --text: var(--tg-theme-text-color, #111);
  --hint: var(--tg-theme-hint-color, #8a8f98);
  --link: var(--tg-theme-link-color, #2f80ed);
  --btn: var(--tg-theme-button-color, #2f80ed);
  --btn-text: var(--tg-theme-button-text-color, #fff);
  --accent: #e6167a;
  --radius: 14px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--text);
  font: 15px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  padding-bottom: env(safe-area-inset-bottom);
}
.screen{display:none}
.screen.active{display:block}

.topbar{position:sticky;top:0;z-index:5;background:var(--bg);padding:12px 12px 6px;border-bottom:1px solid var(--sec-bg)}
.total{font-size:13px;color:var(--hint);margin-bottom:8px}
.total b{color:var(--text)}
.searchrow{display:flex;gap:8px}
#search{flex:1;padding:11px 12px;border:none;border-radius:var(--radius);background:var(--sec-bg);color:var(--text);font-size:15px}
#search::placeholder{color:var(--hint)}

button{cursor:pointer;font:inherit;border:none;border-radius:var(--radius)}
.ghost{background:var(--sec-bg);color:var(--text);padding:11px 14px}
.primary{background:var(--btn);color:var(--btn-text);padding:12px 16px;font-weight:600}
.primary:disabled{opacity:.6}

.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.chip{background:var(--accent);color:#fff;font-size:12px;padding:4px 9px;border-radius:20px;display:inline-flex;gap:6px;align-items:center}
.chip .x{opacity:.8;font-weight:700}

.filters{padding:12px;background:var(--sec-bg);margin:8px 12px;border-radius:var(--radius)}
.filters.hidden{display:none}
.fgroup{margin-bottom:14px}
.fgroup.two{display:flex;gap:10px}
.fgroup.two>div{flex:1}
.flabel{font-size:12px;color:var(--hint);margin-bottom:6px}
.opts{display:flex;flex-wrap:wrap;gap:6px}
.opt{padding:7px 11px;border-radius:20px;background:var(--bg);color:var(--text);font-size:13px;border:1px solid transparent}
.opt.on{background:var(--btn);color:var(--btn-text)}
.filters input[type=text],.filters input[type=date],.filters select{
  width:100%;padding:10px;border:none;border-radius:10px;background:var(--bg);color:var(--text);font-size:14px}
.factions{display:flex;gap:10px}
.factions .ghost{flex:0 0 auto;background:var(--bg)}
.factions .primary{flex:1}

.list{padding:8px 12px 4px}
.card{background:var(--sec-bg);border-radius:var(--radius);padding:13px;margin-bottom:10px}
.card h3{margin:0 0 8px;font-size:15px;font-weight:600;line-height:1.35}
.card .meta{font-size:12.5px;color:var(--hint);display:flex;flex-direction:column;gap:3px}
.card .meta .row{display:flex;gap:6px;align-items:center}
.card .deadline{color:var(--text)}
.card .left{color:var(--accent);font-weight:600}
.card .tags{margin-top:8px;display:flex;flex-wrap:wrap;gap:5px}
.card .tag{font-size:11px;color:var(--hint);background:var(--bg);padding:3px 7px;border-radius:8px}

.more{padding:8px 12px 20px;text-align:center}
.more.hidden,.empty.hidden{display:none}
.more .ghost{width:100%}
.empty{padding:40px 12px;text-align:center;color:var(--hint)}

.detailbar{position:sticky;top:0;background:var(--bg);padding:10px 12px;z-index:5}
.detail{padding:4px 14px 30px}
.detail h2{font-size:18px;margin:6px 0 12px;line-height:1.35}
.detail .kv{display:flex;gap:8px;font-size:14px;margin:6px 0}
.detail .kv .k{color:var(--hint);min-width:120px}
.detail .price{font-size:22px;font-weight:700;margin:16px 0}
.detail .buybtn{width:100%;padding:15px;font-size:16px}
.detail .locked{background:var(--sec-bg);border-radius:var(--radius);padding:14px;margin-top:14px;color:var(--hint);font-size:13px}
.detail .desc{margin-top:14px;font-size:14px;line-height:1.5}
.detail .desc p{margin:0 0 8px}
.detail .files{margin-top:14px}
.detail .file{background:var(--sec-bg);border-radius:10px;padding:10px 12px;margin-bottom:7px;font-size:13px}
.detail a{color:var(--link)}
.badge{display:inline-block;background:var(--accent);color:#fff;font-size:12px;padding:3px 10px;border-radius:20px;margin-bottom:8px}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#000;color:#fff;
  padding:10px 16px;border-radius:12px;font-size:13px;z-index:50;max-width:90%;text-align:center}
.toast.hidden{display:none}
.skeleton{height:96px;background:var(--sec-bg);border-radius:var(--radius);margin-bottom:10px;animation:pulse 1.2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}