:root{
  --paper:#F2F4EE;
  --card:#FCFDF9;
  --ink:#16201A;
  --ink-2:#586850;
  --ink-3:#8A968C;
  --rule:#DCE3D6;
  --rule-2:#E9EEE4;
  --lime:#C8F24E;
  --lime-2:#9DC92A;
  --lime-soft:#EDF6D2;
  --warn:#C98A26;
  --bad:#BF5340;
  --good:#3B7A50;
  --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans SC","Noto Sans SC","Microsoft YaHei",sans-serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,"Roboto Mono",monospace;
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--sans);
  background:var(--paper);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  font-size:15px;
  line-height:1.5;
  overflow-x:hidden;
}
h1,h2,h3,h4{margin:0;font-weight:600}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer;border:none;background:none;padding:0}
input,textarea{outline:none}
a{color:inherit;text-decoration:none}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em}

/* ===== 布局 ===== */
.shell{display:block;min-height:100vh}
.rail{
  padding:20px 18px 16px;
  border-bottom:1px solid var(--rule);
  background:var(--paper);
}
.main{padding:0 18px 48px}

@media(min-width:900px){
  .shell{display:grid;grid-template-columns:298px minmax(0,1fr)}
  .rail{
    position:sticky;top:0;height:100vh;
    border-bottom:none;border-right:1px solid var(--rule);
    padding:30px 26px 22px;
    display:flex;flex-direction:column;
  }
  .main{padding:0 36px 72px;max-width:1240px}
}

/* ===== 侧栏 ===== */
.brand{display:flex;align-items:baseline;gap:10px}
.brand h1{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-weight:700;font-size:27px;line-height:1;letter-spacing:0}
.brand span{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:var(--ink-3);
}
.slogan{font-size:12px;color:var(--ink-3);margin-top:6px;line-height:1.5}
.langs{display:flex;gap:4px;margin-top:12px;flex-wrap:wrap}
.langs button{
  min-height:32px;padding:0 10px;border-radius:6px;
  border:1px solid var(--rule);background:var(--card);
  font-size:11.5px;color:var(--ink-2);
  transition:background .15s,color .15s,border-color .15s;
}
.langs button:hover{border-color:var(--ink-3);color:var(--ink)}
.langs button.on{background:var(--ink);border-color:var(--ink);color:#F4F7EF}

.total-block{margin-top:22px}
.total-label{font-size:12px;color:var(--ink-2);letter-spacing:.04em}
.total-value{
  font-family:var(--mono);font-size:34px;font-weight:600;line-height:1.1;margin-top:4px;
  letter-spacing:-.02em;
}
.total-value .cur{font-size:15px;color:var(--ink-2);margin-right:2px;font-weight:400}
.daily-line{
  margin-top:10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-size:12.5px;color:var(--ink-2);
}
.daily-pill{
  background:var(--lime);color:var(--ink);border-radius:2px;
  padding:1px 6px;font-family:var(--mono);font-size:12.5px;font-weight:600;
}
@media(min-width:900px){ .total-value{font-size:40px} }

.stat-row{display:flex;gap:6px;margin-top:16px}
.stat-cell{flex:1 1 0;min-width:0;border-top:1px solid var(--rule);padding-top:7px}
.stat-cell b{display:block;font-family:var(--mono);font-size:15px;font-weight:600}
.stat-cell i{display:block;font-style:normal;font-size:11px;color:var(--ink-3);margin-top:1px}

.tabs{display:flex;gap:6px;margin-top:20px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.tabs::-webkit-scrollbar{display:none}
@media(min-width:900px){
  .tabs{flex-direction:column;gap:2px;margin-top:26px;overflow:visible}
}
.tab{
  flex:0 0 auto;display:flex;align-items:center;gap:9px;
  padding:9px 14px;border-radius:8px;font-size:13.5px;color:var(--ink-2);
  transition:background .16s ease,color .16s ease;
  min-height:44px;white-space:nowrap;
}
.tab:hover{background:var(--rule-2);color:var(--ink)}
.tab.on{background:var(--ink);color:#F6F8F1}
.tab .dot{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.35}
.tab.on .dot{opacity:.9}
@media(min-width:900px){ .tab{width:100%} }

.rail-foot{margin-top:16px;padding-top:0;display:flex;gap:4px;flex-wrap:wrap}
@media(min-width:900px){ .rail-foot{margin-top:auto;padding-top:20px;flex-direction:column;flex-wrap:nowrap} }
.foot-btn{
  font-size:11.5px;color:var(--ink-3);padding:7px 9px;border-radius:6px;
  transition:background .16s,color .16s;text-align:left;
}
.foot-btn:hover{background:var(--rule-2);color:var(--ink)}

/* ===== 顶栏 ===== */
.topbar{
  position:sticky;top:0;z-index:20;
  background:var(--paper);
  padding:16px 0 12px;
  display:flex;gap:10px;align-items:center;
}
@media(min-width:900px){ .topbar{padding:24px 0 16px} }
.search{
  flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:9px;
  background:var(--card);border:1px solid var(--rule);border-radius:9px;
  padding:0 12px;height:42px;
  transition:border-color .16s;
}
.search:focus-within{border-color:var(--ink-3)}
.search svg{flex:0 0 auto;width:16px;height:16px;stroke:var(--ink-3)}
.search input{
  flex:1 1 auto;min-width:0;border:none;background:none;
  font-size:16px;height:100%;color:var(--ink);
}
.search input::placeholder{color:var(--ink-3);font-size:13.5px}
@media(min-width:900px){ .search{max-width:420px} .search input{font-size:14px} }

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:42px;padding:0 15px;border-radius:9px;font-size:13.5px;
  border:1px solid var(--rule);background:var(--card);color:var(--ink);
  transition:transform .14s ease,border-color .16s ease,background .16s ease;
  white-space:nowrap;
}
.btn:hover{border-color:var(--ink-3)}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--lime);border-color:var(--lime);font-weight:600}
.btn-primary:hover{background:var(--lime-2);border-color:var(--lime-2);color:var(--ink)}
.btn svg{width:14px;height:14px;stroke:currentColor}
.icon-btn{
  width:42px;height:42px;border-radius:9px;border:1px solid var(--rule);background:var(--card);
  display:inline-flex;align-items:center;justify-content:center;
}
.icon-btn svg{width:16px;height:16px;stroke:var(--ink-2)}
.sort-wrap{position:relative;flex:0 0 auto}
.sort-wrap svg{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:12px;height:12px;stroke:var(--ink-2);pointer-events:none}
select#sort{
  appearance:none;-webkit-appearance:none;
  height:42px;padding:0 28px 0 12px;border-radius:9px;
  border:1px solid var(--rule);background:var(--card);
  font-size:13px;color:var(--ink-2);cursor:pointer;
}
@media(max-width:899px){
  #addBtn span{display:none}
  #addBtn{padding:0 12px}
}
@media(max-width:639px){
  .sort-wrap{display:none}
}

/* ===== 筛选 ===== */
.filter-row{margin-bottom:16px}
.chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.chips::-webkit-scrollbar{display:none}
.chip{
  flex:0 0 auto;height:32px;padding:0 12px;border-radius:16px;
  border:1px solid transparent;background:transparent;color:var(--ink-2);
  font-size:12.5px;display:inline-flex;align-items:center;gap:5px;
  transition:background .16s,color .16s;
}
.chip:hover{background:var(--rule-2);color:var(--ink)}
.chip.on{background:var(--ink);color:#F3F6EE}
.chip .n{font-family:var(--mono);font-size:11px;opacity:.6}
.chips-status{margin-top:4px;display:flex}
@media(min-width:900px){ .chips-status{margin-top:2px} }
.filter-sep{width:1px;height:20px;background:var(--rule);flex:0 0 auto;align-self:center;margin:0 4px}

/* ===== 物品网格 ===== */
.grid-items{
  display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:10px;
}
@media(min-width:560px){ .grid-items{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} }
@media(min-width:1000px){ .grid-items{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px} }
@media(min-width:1300px){ .grid-items{grid-template-columns:repeat(4,minmax(0,1fr))} }

.item-card{
  background:var(--card);border:1px solid var(--rule);border-radius:12px;
  padding:13px 14px 12px;display:flex;flex-direction:column;
  transition:border-color .16s ease,transform .16s ease;
  text-align:left;position:relative;min-width:0;
}
.item-card:hover{border-color:var(--ink-3);transform:translateY(-1px)}
.item-card.sold{opacity:.68}
.card-head{display:flex;align-items:flex-start;gap:10px}
.ico{
  width:38px;height:38px;border-radius:9px;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;
}
.ico svg{width:20px;height:20px;stroke:#24322B;stroke-width:1.6;fill:none}
.card-title{flex:1 1 auto;min-width:0}
.card-name{
  font-size:14.5px;font-weight:600;line-height:1.3;
  overflow:hidden;text-overflow:ellipsis;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;
  word-break:break-word;
}
.card-sub{font-size:11.5px;color:var(--ink-3);margin-top:3px;font-family:var(--mono)}
.card-meta{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:2px}
.tag{
  font-size:10.5px;padding:1px 6px;border-radius:3px;background:var(--rule-2);
  color:var(--ink-2);white-space:nowrap;
}
.tag.retired{background:#F0EADB;color:#8A6A20}
.tag.sold{background:#EDE6E3;color:#8C5343}
.card-figure{
  display:flex;align-items:flex-end;justify-content:space-between;gap:8px;
  margin-top:12px;padding-top:10px;border-top:1px dashed var(--rule);
}
.daily{display:flex;align-items:baseline;gap:2px;min-width:0}
.daily .v{font-family:var(--mono);font-size:21px;font-weight:600;letter-spacing:-.02em}
.daily .u{font-size:11px;color:var(--ink-3)}
.daily-note{font-size:11px;color:var(--ink-3);white-space:nowrap}
.daily-note.ok{color:var(--good);font-weight:600}
.bar{margin-top:9px}
.bar-track{height:4px;border-radius:2px;background:var(--rule-2);overflow:hidden;position:relative}
.bar-fill{height:100%;border-radius:2px;background:var(--lime-2);transition:width .3s ease}
.bar-fill.full{background:var(--good)}
.bar-fill.idle{background:var(--warn)}
.bar-cap{display:flex;justify-content:space-between;font-size:10.5px;color:var(--ink-3);margin-top:5px}
.bar-cap .pct{font-family:var(--mono)}

/* ===== 空态 ===== */
.empty{
  border:1px dashed var(--rule);border-radius:12px;padding:44px 24px;text-align:center;
}
.empty h3{font-size:14px;font-weight:600;color:var(--ink)}
.empty p{font-size:12.5px;color:var(--ink-3);margin:8px auto 0;max-width:320px;line-height:1.6}

/* ===== 洞察 ===== */
.section{margin-top:28px}
.section-head{display:flex;align-items:baseline;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.section-head h2{font-size:16px;letter-spacing:.02em}
.section-head p{font-size:12px;color:var(--ink-3);margin:0}
.metric-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;
  background:var(--rule);border:1px solid var(--rule);border-radius:12px;overflow:hidden;
}
@media(min-width:760px){ .metric-grid{grid-template-columns:repeat(4,minmax(0,1fr))} }
.metric{background:var(--card);padding:14px 15px;min-width:0}
.metric i{font-style:normal;font-size:11.5px;color:var(--ink-3);display:block}
.metric b{
  display:block;font-family:var(--mono);font-size:22px;font-weight:600;
  margin-top:5px;letter-spacing:-.02em;line-height:1.15;
}
.metric b .u{font-size:11px;color:var(--ink-3);font-weight:400;margin-left:2px}
.metric s{display:block;font-size:11px;color:var(--ink-3);text-decoration:none;margin-top:4px}

/* 图表 */
.chart-body{background:var(--card);border:1px solid var(--rule);border-radius:12px;padding:14px 14px 8px}
.chart-svg{display:block;width:100%;height:auto;overflow:visible}
.chart-legend{display:flex;gap:14px;font-size:11.5px;color:var(--ink-3);margin-top:4px;padding-left:2px}
.chart-legend span{display:inline-flex;align-items:center;gap:5px}
.swatch{width:9px;height:9px;border-radius:2px;display:inline-block}
.chart-empty{font-size:12.5px;color:var(--ink-3);padding:36px 0;text-align:center}

/* 分布条 */
.dist{background:var(--card);border:1px solid var(--rule);border-radius:12px;padding:16px 16px 8px}
.dist-row{margin-bottom:14px}
.dist-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:12.5px}
.dist-top .name{color:var(--ink)}
.dist-top .val{font-family:var(--mono);font-size:12px;color:var(--ink-2)}
.dist-track{height:6px;border-radius:3px;background:var(--rule-2);margin-top:7px;overflow:hidden}
.dist-fill{height:100%;border-radius:3px;transition:width .35s ease}

/* 排行 */
.rank{background:var(--card);border:1px solid var(--rule);border-radius:12px;overflow:hidden}
.rank-row{
  display:flex;align-items:center;gap:11px;padding:11px 14px;
  border-bottom:1px solid var(--rule-2);
}
.rank-row:last-child{border-bottom:none}
.rank-i{font-family:var(--mono);font-size:11px;color:var(--ink-3);width:14px;flex:0 0 auto}
.rank-name{flex:1 1 auto;min-width:0;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rank-bar{flex:0 0 74px;height:5px;border-radius:3px;background:var(--rule-2);overflow:hidden}
.rank-fill{height:100%;background:var(--lime-2);border-radius:3px}
.rank-val{font-family:var(--mono);font-size:12.5px;width:52px;text-align:right;flex:0 0 auto;font-weight:600}
@media(max-width:559px){ .rank-bar{display:none} }

/* 智能发现 */
.findings{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:760px){ .findings{grid-template-columns:repeat(3,minmax(0,1fr))} }
.finding{
  background:var(--card);border:1px solid var(--rule);border-radius:12px;
  padding:14px 15px;display:flex;flex-direction:column;gap:6px;min-width:0;
}
.finding .k{font-size:11px;color:var(--ink-3);display:flex;align-items:center;gap:5px}
.finding .k svg{width:12px;height:12px;stroke:currentColor;fill:none}
.finding .t{font-size:14px;font-weight:600;line-height:1.35;word-break:break-word}
.finding .d{font-size:12px;color:var(--ink-2);line-height:1.55}
.finding .d b{font-family:var(--mono);font-weight:600}

/* ===== 心愿 ===== */
.wish-list{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:700px){ .wish-list{grid-template-columns:repeat(2,minmax(0,1fr))} }
.wish-card{background:var(--card);border:1px solid var(--rule);border-radius:12px;padding:14px 15px}
.wish-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.wish-name{font-size:14.5px;font-weight:600}
.wish-price{font-family:var(--mono);font-size:14px;color:var(--ink-2);flex:0 0 auto}
.wish-track{height:6px;border-radius:3px;background:var(--rule-2);margin-top:12px;overflow:hidden}
.wish-fill{height:100%;background:var(--lime);border-radius:3px;transition:width .3s ease}
.wish-foot{display:flex;justify-content:space-between;font-size:11.5px;color:var(--ink-3);margin-top:8px;gap:8px}
.wish-foot .num{color:var(--ink-2)}
.wish-actions{display:flex;gap:16px;margin-top:12px;padding-top:10px;border-top:1px dashed var(--rule)}
.link-btn{font-size:12px;color:var(--ink-2);padding:4px 0;transition:color .14s}
.link-btn:hover{color:var(--ink);text-decoration:underline}

/* ===== 模态 ===== */
.modal{
  position:fixed;inset:0;z-index:100;display:none;
  background:rgba(22,32,26,.34);
  backdrop-filter:blur(2px);
  padding:0;
}
.modal.on{display:flex;align-items:flex-end;justify-content:center}
@media(min-width:640px){ .modal.on{align-items:center} }
.sheet{
  background:var(--card);width:100%;max-height:92vh;overflow-y:auto;
  border-radius:16px 16px 0 0;padding:20px 20px calc(20px + env(safe-area-inset-bottom));
  animation:rise .24s cubic-bezier(.22,.9,.3,1);
}
@media(min-width:640px){
  .sheet{width:520px;max-width:calc(100vw - 48px);border-radius:16px;max-height:88vh}
}
@keyframes rise{from{transform:translateY(22px);opacity:.7}to{transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){ .sheet{animation:none} }
.sheet-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:12px}
.sheet-head h3{font-size:16px}
.close-x{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center}
.close-x:hover{background:var(--rule-2)}
.close-x svg{width:15px;height:15px;stroke:var(--ink-2)}

.form-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:520px){ .form-grid{grid-template-columns:1fr 1fr} .span-2{grid-column:1/-1} }
.field label{display:block;font-size:11.5px;color:var(--ink-3);margin-bottom:5px}
.field input,.field select,.field textarea{
  width:100%;min-height:42px;padding:10px 11px;border-radius:8px;
  border:1px solid var(--rule);background:var(--paper);
  font-size:16px;transition:border-color .16s;
}
@media(min-width:640px){ .field input,.field select,.field textarea{font-size:14px} }
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--ink-3);background:var(--card)}
.field textarea{min-height:64px;resize:vertical;font-family:inherit}
.field select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%23586850' stroke-width='1.6' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:14px;padding-right:30px}
.seg{display:flex;gap:6px;flex-wrap:wrap}
.seg button{
  flex:1 1 auto;min-height:38px;padding:0 10px;border-radius:8px;
  border:1px solid var(--rule);background:var(--paper);font-size:13px;color:var(--ink-2);
}
.seg button.on{background:var(--ink);color:#F3F6EE;border-color:var(--ink)}
.hint{font-size:11.5px;color:var(--ink-3);margin-top:6px;line-height:1.5}
.calc-preview{
  background:var(--lime-soft);border-radius:9px;padding:11px 13px;margin-top:14px;
  display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;
}
.calc-preview .lab{font-size:11.5px;color:var(--ink-2)}
.calc-preview .big{font-family:var(--mono);font-size:19px;font-weight:600}
.sheet-actions{display:flex;gap:8px;margin-top:18px}
.sheet-actions .btn{flex:1 1 auto}
.btn-danger{background:#F8EBE7;border-color:#EFD5CD;color:#A8452F}
.btn-danger:hover{background:#F2DCD5;border-color:#E3BEB2;color:#8E3623}

/* ===== toast ===== */
.toast{
  position:fixed;left:50%;bottom:28px;transform:translate(-50%,14px);
  background:var(--ink);color:#F4F7EF;font-size:13px;
  padding:10px 16px;border-radius:9px;z-index:120;
  opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;
  max-width:calc(100vw - 40px);
}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ===== 视图切换 ===== */
.view{display:none}
.view.on{display:block;animation:fade .22s ease}
@keyframes fade{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){ .view.on{animation:none} }

.kbd-hint{font-size:11.5px;color:var(--ink-3);margin-top:14px;line-height:1.6}