/* 2026 refresh — local assets, responsive archive workspace */
:root { --paper:#f5f4ef; --card:#fff; --line:#e4e7e1; --text:#243a30; --muted:#728078; --gold:#bc9857; --gold-deep:#826526; --radius-img:12px; --shadow-card:0 3px 16px #22382b08; }
body { background:var(--paper); }
button,input,select { font:inherit; }
button { touch-action:manipulation; }
.topbar { padding:36px 28px; border:0; background:linear-gradient(120deg,#173c2c,#284d3b); }
.topbar-inner { max-width:1360px; }
.eyebrow { display:block; color:#cfb887; font-size:11px; letter-spacing:2px; margin-bottom:12px; }
.topbar h1 { font-family:var(--font-body); font-size:30px; letter-spacing:1px; font-weight:600; }
.topbar .subtitle { margin-top:12px; }
.hero-hint { color:#d4dfd6; font-size:13px; margin-top:8px; }
.shop-tabs { max-width:1416px; padding:24px 28px 12px; gap:8px; }
.shop-tabs .tab { background:#fff; color:var(--text); border:1px solid var(--line); border-radius:9px; padding:10px 12px; font-size:12px; }
.shop-tabs .tab .cnt { color:var(--muted); font-size:11px; padding:2px 5px; background:#f1f4ef; border-radius:4px; }
.shop-tabs .tab:hover { color:#173c2c; border-color:#a9bcae; }
.shop-tabs .tab.active { color:#fff; background:#244b37; border-color:#244b37; }
.shop-tabs .tab.active .cnt { color:#fff; background:#ffffff20; }
.toolbar { max-width:1360px; margin:0 auto; padding:20px; background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow-card); gap:12px; }
.toolbar input[type=search],.toolbar select,.combobox input { border-radius:8px; padding:11px 12px; box-shadow:none; background:#fafbf8; min-height:44px; }
.search-wrap { flex-basis:320px; }
.combobox { max-width:none; flex:1 1 170px; }
.toolbar select { min-height:44px; }
.tool-btn,.btn-primary { background:#244b37; color:white; border:1px solid #244b37; border-radius:8px; padding:11px 16px; min-height:44px; }
.tool-btn:hover,.btn-primary:hover { background:#173c2c; color:white; }
.brand-list { border-radius:10px; border-color:var(--line); box-shadow:0 12px 30px #173c2c20; }
.brand-list li { min-height:40px; border-radius:6px; }
.count-info { color:var(--muted); }
.count-info b { color:#244b37; }
.price-filter { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:12px; }
.price-filter input { width:104px; min-height:40px; border:1px solid var(--line); border-radius:8px; padding:9px; background:#fafbf8; color:var(--text); }
.reset-btn { border:0; border-radius:8px; background:#f0f3ed; color:#42604c; padding:10px 14px; min-height:40px; cursor:pointer; }
.reset-btn:hover { background:#e2e9df; }
.filter-chips { max-width:1360px; padding:14px 0 0; gap:8px; }
.chip { border-radius:20px; background:#eaf0e7; color:#42604c; border-color:#dae4d5; padding:5px 10px; }
.chip-x { min-width:24px; min-height:24px; color:#42604c; }
.grid { max-width:1360px; background:transparent; border:0; box-shadow:none; padding:12px 0 24px; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:20px; border-radius:0; }
.card { border-radius:14px; border-color:var(--line); box-shadow:var(--shadow-card); }
.card:hover { border-color:#afc2b1; box-shadow:0 10px 25px #173c2c12; transform:translateY(-3px); }
.thumb { margin:8px 8px 0; background:#edf0e9; }
.thumb img { object-fit:contain; background:white; }
.noimg-tip { color:var(--muted); }
.meta { padding:14px; }
.name { font-size:14px; line-height:1.55; height:44px; margin-bottom:10px; }
.price { font-size:21px; color:#244b37; margin-bottom:10px; }
.price-missing { font-size:13px; line-height:29px; color:var(--muted); font-weight:400; }
.tags { gap:6px; }
.tag { border-radius:5px; padding:3px 6px; white-space:normal; overflow-wrap:anywhere; }
.tag.shop { background:#edf2ea; color:#526b55; border:0; font-size:10px; width:100%; }
.tag.brand { background:#f7f2e6; border:0; }
.tag.cond { border:0; background:#f5edef; }
.channel { border:0; background:#f2f4f0; border-radius:4px; }
.row { padding-top:12px; margin-top:10px; border-top:1px solid #eef0ea; gap:6px; flex-wrap:wrap; }
.sell b { color:#244b37; }
.actions { gap:6px; }
.go { font-size:11px; }
.copy-btn { font:inherit; font-size:11px; min-height:30px; padding:5px 8px; border:1px solid #dce5d7; border-radius:6px; color:#42604c; background:#fff; }
.loader,.foot { color:var(--muted); }
.loader::after { border-color:#d8e2d5; border-top-color:#244b37; }
.modal { border-radius:16px; border:0; max-width:760px; }
.modal::before { display:none; }
.modal-body { padding:28px; }
.modal-close { position:sticky; top:12px; float:right; margin:12px 12px -44px 0; border-radius:50%; width:36px; height:36px; box-shadow:0 3px 10px #173c2c14; }
.modal-img { background:#f4f6f0; border-radius:12px; }
.modal-name { font-family:var(--font-body); font-size:20px; padding-right:10px; }
.modal-info dt { color:var(--muted); }
.detail-price { font-size:22px!important; font-weight:700; color:#244b37; }
.modal-wide { max-width:1120px; }
.match-head h3 { font-family:var(--font-body); }
.match-config { border-radius:10px; gap:14px; }
.match-field select { min-height:40px; border-radius:6px; }
.match-actions { display:flex; flex-wrap:wrap; gap:8px; }
.match-table-wrap { border-radius:10px; }
.match-table th { background:#244b37; }
.match-table td { padding:12px; }
.match-table tbody tr:nth-child(even) { background:#fafbf8; }
.match-daren-clear { min-height:36px; }
.toast { background:#244b37; border:0; border-radius:10px; padding:12px 20px; }
.back-top { position:fixed; right:24px; bottom:24px; z-index:50; width:44px; height:44px; border:1px solid #dce5d7; border-radius:50%; background:#244b37; color:#fff; font-size:22px; cursor:pointer; box-shadow:0 6px 24px #173c2c25; }
.back-top[hidden] { display:none; }
@media(max-width:1420px) { .toolbar,.grid,.filter-chips { margin-left:28px; margin-right:28px; } }
@media(max-width:760px) {
 .topbar { padding:26px 18px; } .topbar h1 { font-size:23px; }
 .shop-tabs { flex-wrap:nowrap; overflow-x:auto; padding:16px 16px 12px; scrollbar-width:thin; }
 .shop-tabs .tab { flex-shrink:0; max-width:220px; }
 .toolbar,.grid,.filter-chips { margin-left:16px; margin-right:16px; }
 .toolbar { padding:14px; gap:10px; } .search-wrap { order:-2; flex:1 1 100%; }
 .tool-btn { order:-1; width:100%; } .combobox { flex:1 1 130px; min-width:0; }
 .toolbar select { flex:1 1 130px; max-width:none; }
 .price-filter { flex:1 1 100%; } .price-filter input { flex:1; width:60px; min-width:0; }
 .count-info { flex-basis:auto; margin-left:auto; }
 .grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:12px 0; }
 .meta { padding:10px; } .name { font-size:12px; height:38px; }
 .price { font-size:18px; } .price-missing { font-size:12px; line-height:25px; }
 .tag { font-size:10px; } .tag.shop { font-size:9px; }
 .row { align-items:flex-start; gap:8px; } .sell { font-size:11px; }
 .actions { width:100%; justify-content:space-between; } .copy-btn { min-height:34px; }
 .modal-overlay { padding:12px; align-items:center; } .modal { max-height:92vh; border-radius:14px; }
 .modal-body { padding:18px; } .modal-name { font-size:17px; }
 .match-field { width:100%; } .match-field select { max-width:none; width:100%; }
 .match-actions .btn-primary { width:100%; }
 .back-top { right:16px; bottom:16px; }
}
@media(max-width:350px) { .grid { grid-template-columns:1fr; } }
