:root{--brand:#0B168D;--brand2:#2B3BC8;--bg:#F5F6FA;--card:#fff;--line:#E3E6EE;--text:#1B1F2A;--muted:#6B7280;--ok:#16794A;--low:#B45309;--out:#9CA3AF;--r:10px}
*{box-sizing:border-box}body{margin:0;font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--text);font-size:14px}
a{color:var(--brand2);text-decoration:none}button{font:inherit;cursor:pointer}
.top{background:var(--brand);color:#fff;display:flex;align-items:center;gap:16px;padding:0 28px;height:58px;position:sticky;top:0;z-index:20;flex-wrap:wrap}
.top .logo{font-weight:700;font-size:18px;letter-spacing:1px}.top .sp{flex:1}.top .who{opacity:.9;font-size:13px}
.top button{background:rgba(255,255,255,.14);color:#fff;border:0;border-radius:8px;padding:7px 14px}.top button:hover{background:rgba(255,255,255,.26)}
.badge{display:inline-block;min-width:18px;padding:0 6px;border-radius:9px;background:#FFC53D;color:#1B1F2A;font-size:12px;margin-left:4px;text-align:center}
.wrap{max-width:1400px;margin:0 auto;padding:20px 28px 60px}
.demo{background:#FFF7E6;border:1px solid #FFD591;color:#8A5300;padding:8px 14px;border-radius:8px;margin-bottom:14px;font-size:13px}
.pallets{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.pill{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 14px;color:var(--text)}
.pill.on{background:var(--brand);border-color:var(--brand);color:#fff}.pill small{opacity:.7;margin-left:4px}
.step{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:8px 0}.step .lb{color:var(--muted);width:64px;font-size:13px}
.tabs{display:flex;gap:6px;flex-wrap:wrap}.tab{border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 12px}.tab.on{border-color:var(--brand);color:var(--brand);font-weight:600;background:#EEF0FF}
.bar{display:flex;align-items:center;gap:12px;margin:14px 0;flex-wrap:wrap;color:var(--muted)}.bar input{border:1px solid var(--line);border-radius:8px;padding:7px 10px;width:220px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;cursor:pointer;position:relative;transition:box-shadow .15s}
.card:hover{box-shadow:0 6px 18px rgba(11,22,141,.12)}
.card .img{aspect-ratio:1/1;background:#EEF0F5 center/cover no-repeat}
.card .b{padding:10px 12px}.card .code{font-weight:700}.card .nm{color:var(--muted);font-size:13px;margin-top:2px}
.thumbs{display:flex;gap:4px;margin-top:8px;flex-wrap:wrap}.thumbs span{width:22px;height:22px;border-radius:4px;background:#eee center/cover;border:1px solid var(--line)}
.st{font-size:12px;margin-top:6px}.st.ok{color:var(--ok)}.st.low{color:var(--low)}.st.out{color:var(--out)}
.rank{position:absolute;left:8px;top:8px;background:rgba(11,22,141,.9);color:#fff;font-size:12px;border-radius:6px;padding:2px 8px}
.rank.pin{background:#C8102E}
.fav{position:absolute;right:8px;top:8px;background:rgba(255,255,255,.92);border:0;border-radius:50%;width:32px;height:32px;font-size:17px;color:#C8102E}
.mask{position:fixed;inset:0;background:rgba(10,14,40,.45);display:none;z-index:50;align-items:flex-start;justify-content:center;overflow:auto;padding:40px 16px}
.mask.show{display:flex}.modal{background:#fff;border-radius:14px;max-width:1040px;width:100%;padding:24px;position:relative}
.modal .x{position:absolute;right:14px;top:10px;border:0;background:none;font-size:26px;color:var(--muted)}
.det{display:flex;gap:24px;flex-wrap:wrap}.det .l{flex:1 1 360px}.det .r{flex:1.3 1 420px}
.det .big{aspect-ratio:1/1;background:#EEF0F5 center/contain no-repeat;border-radius:10px}
.cths{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.cth{width:64px;cursor:pointer;text-align:center;font-size:12px;color:var(--muted)}
.cth div{width:64px;height:64px;border-radius:8px;background:#eee center/cover;border:2px solid transparent}.cth.on div{border-color:var(--brand)}
table.m{border-collapse:collapse;width:100%;margin-top:10px}table.m th,table.m td{border-bottom:1px solid var(--line);padding:7px 6px;text-align:center}
table.m th:first-child,table.m td:first-child{text-align:left}table.m input{width:58px;border:1px solid var(--line);border-radius:6px;padding:4px;text-align:center}
table.m td.out input{background:#F3F4F6;color:#bbb}.hint{color:var(--muted);font-size:12px;margin-top:6px}
.btn{border:0;border-radius:8px;padding:9px 18px;background:#EEF0F5;color:var(--text)}.btn.p{background:var(--brand);color:#fff}.btn.d{background:#FDECEC;color:#B42318}
.btn:disabled{opacity:.5}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}
.cg{border:1px solid var(--line);border-radius:10px;padding:12px;margin-bottom:10px;display:flex;gap:12px}
.cg .im{width:72px;height:72px;border-radius:8px;background:#eee center/cover;flex:none}
.tbl{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.tbl th{background:#F7F8FC;color:var(--muted);font-weight:500;text-align:left;padding:10px;border-bottom:1px solid var(--line);font-size:13px}
.tbl td{padding:10px;border-bottom:1px solid var(--line);vertical-align:top}.tbl td.n{text-align:right}
.tag{display:inline-block;padding:2px 8px;border-radius:6px;font-size:12px;background:#EEF0F5}.tag.g{background:#E7F6EE;color:var(--ok)}.tag.y{background:#FFF4E5;color:var(--low)}.tag.r{background:#FDECEC;color:#B42318}.tag.b{background:#EEF0FF;color:var(--brand)}
.login{max-width:400px;margin:80px auto;background:#fff;border-radius:16px;padding:34px;border:1px solid var(--line)}
.login h1{margin:0 0 4px;color:var(--brand);font-size:24px}.login input{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:8px;margin-top:12px;font-size:15px}
.login .btn{width:100%;margin-top:16px;padding:12px}.err{color:#B42318;margin-top:10px;min-height:20px;font-size:13px}
.side{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap}
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:16px}.kpi{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px}.kpi b{font-size:22px;display:block}.kpi span{color:var(--muted);font-size:12px}
textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:10px;font:inherit}
pre.share{background:#F7F8FC;border:1px solid var(--line);border-radius:10px;padding:14px;white-space:pre-wrap;font:inherit}
.empty{color:var(--muted);padding:30px;text-align:center}

.pvbar{position:sticky;top:0;z-index:50;display:flex;flex-wrap:wrap;align-items:center;gap:10px;background:#7C2D12;color:#fff;padding:9px 16px;font-size:13px}
.pvbar b{background:#FDBA74;color:#7C2D12;border-radius:6px;padding:2px 8px;font-size:14px}
.pvbar .hint2{color:#FED7AA;font-size:12px}.pvbar .sp{flex:1}
.pvbar button{background:#fff;color:#7C2D12;border:0;border-radius:8px;padding:6px 14px;font-weight:600;cursor:pointer}

.top .logo{display:flex;align-items:center;gap:12px;white-space:nowrap}.top .logo img{height:24px;width:auto;display:block}
.top .logo i{width:1px;height:20px;background:rgba(255,255,255,.4);display:block}
.login .lglogo{height:30px;width:auto;display:block;margin:0 0 18px}
@media(max-width:640px){.top .logo img{height:18px}.top{padding:0 14px}}