:root { --red:#c62828; --bg:#f5f6f8; --card:#fff; --txt:#222; --sub:#888; --line:#eee; }
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
body { margin:0; font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif; background:var(--bg); color:var(--txt); font-size:15px; }
.hidden { display:none !important; }
.offline { position:sticky; top:0; z-index:99; background:#ff9800; color:#fff; font-size:12px; padding:6px 12px; }
#app { max-width:520px; margin:0 auto; padding-bottom:76px; }
.nav { position:fixed; bottom:0; left:50%; transform:translateX(-50%); width:100%; max-width:520px; display:flex; background:#fff; border-top:1px solid var(--line); padding-bottom:env(safe-area-inset-bottom); z-index:98; }
.nav button { flex:1; border:0; background:none; padding:10px 0 8px; font-size:11px; color:var(--sub); display:flex; flex-direction:column; align-items:center; gap:2px; }
.nav button.active { color:var(--red); }
.nav button span.i { font-size:20px; }

.top { background:var(--red); color:#fff; padding:16px 16px 20px; }
.top h1 { margin:0; font-size:19px; }
.top p { margin:4px 0 0; font-size:12px; opacity:.85; }

.card { background:var(--card); margin:12px; border-radius:14px; padding:14px; box-shadow:0 1px 4px rgba(0,0,0,.05); }
h2.sec { font-size:15px; margin:16px 16px 4px; }
.muted { color:var(--sub); font-size:12px; }

.grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:14px; }
.tile { background:var(--card); border-radius:16px; padding:16px 6px; text-align:center; box-shadow:0 1px 4px rgba(0,0,0,.05); border:0; font-size:13px; color:var(--txt); }
.tile .ico { font-size:30px; display:block; margin-bottom:6px; }
.tile b { font-weight:600; }
.tile small { display:block; color:var(--sub); font-size:10px; margin-top:2px; }

button.primary { width:100%; background:var(--red); color:#fff; border:0; border-radius:12px; padding:13px; font-size:16px; font-weight:600; }
button.ghost { background:#fff; border:1px solid var(--red); color:var(--red); border-radius:12px; padding:10px; width:100%; }
input, select, textarea { width:100%; border:1px solid #ddd; border-radius:10px; padding:11px; font-size:15px; margin:6px 0; background:#fff; }
.row { display:flex; gap:8px; align-items:center; }
.row > * { flex:1; }

.prod { display:flex; align-items:center; gap:8px; padding:10px 0; border-bottom:1px solid var(--line); min-width:0; }
.prod .info { flex:1 1 auto; min-width:120px; }
.prod .name { font-size:13px; word-break:break-word; overflow-wrap:anywhere; }
.prod .code { color:var(--sub); font-size:11px; word-break:break-all; }
.prod .price { font-weight:700; color:var(--red); font-size:14px; white-space:nowrap; flex:0 0 auto; }
.prod button { width:auto; flex:0 0 auto; white-space:nowrap; }
.qty { width:64px; text-align:center; padding:6px !important; margin:0 !important; }
.chip { display:inline-block; background:#fdeaea; color:var(--red); border-radius:999px; padding:4px 12px; font-size:12px; margin:4px 4px 0 0; border:0; }
.chip.on { background:var(--red); color:#fff; }
.tag { display:inline-block; background:#f2f2f2; color:var(--sub); border-radius:6px; padding:2px 8px; font-size:11px; margin-right:4px; }

.item { border-bottom:1px solid var(--line); padding:10px 0; }
.item .title { font-size:14px; font-weight:600; }
.badge { float:right; font-size:11px; padding:2px 8px; border-radius:6px; background:#e8f5e9; color:#2e7d32; }
.badge.warn { background:#fff3e0; color:#e65100; }
.stage { font-size:11px; border-radius:6px; padding:2px 8px; background:#ede7f6; color:#5e35b1; }

.total-bar { display:flex; justify-content:space-between; align-items:center; padding:12px 4px 0; font-size:17px; font-weight:700; color:var(--red); }
.msg { margin:8px 0; padding:10px 12px; border-radius:12px; max-width:86%; font-size:14px; line-height:1.5; white-space:pre-wrap; }
.msg.me { background:var(--red); color:#fff; margin-left:auto; }
.msg.ai { background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.06); }
.msg.err { background:#fff3e0; color:#bf360c; }
.tool-result { font-size:14px; line-height:1.7; }
.kv { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid var(--line); font-size:14px; }
.fab { position:fixed; right:16px; bottom:90px; width:52px; height:52px; border-radius:50%; background:var(--red); color:#fff; font-size:24px; border:0; box-shadow:0 4px 12px rgba(198,40,40,.4); z-index:97; }
.center { text-align:center; }

/* 报价页按钮组：统一尺寸，两级视觉层级 */
.btn2 { display:flex; gap:8px; }
.btn2 button { flex:1; width:auto; padding:12px 8px; font-size:14px; border-radius:12px; white-space:nowrap; }
.btn2 .soft { background:#fafafa; border:1px solid var(--line); color:var(--sub); }

/* 历史报价按钮组：2x2 等大红描边 */
.hist-btns { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.hist-btns button { flex:0 0 calc(50% - 4px); width:auto; padding:10px 8px; font-size:13px; border-radius:10px; background:#fff; border:1px solid var(--red); color:var(--red); }