* { box-sizing:border-box; margin:0; padding:0; -webkit-tap-highlight-color:transparent; }
body { font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif; background:#191b1f; color:#ded9cf; display:flex; justify-content:center; min-height:100vh; }
#app { width:100%; max-width:430px; min-height:100vh; background:#22242a; border-left:1px solid #34373e; border-right:1px solid #34373e; display:flex; flex-direction:column; }
.statusbar { padding:10px 14px; background:#262930; border-bottom:1px solid #363941; font-size:13px; }
.row1,.row2,.row3 { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.row1 { font-size:16px; font-weight:700; }
.row2,.row3 { margin-top:4px; color:#918b80; font-size:12px; }
b { color:#d8d0bd; font-weight:600; }
.neg { color:#e07a6a!important; }
.good { color:#79b88a!important; }
.feed { flex:1; overflow-y:auto; padding:14px; padding-bottom:88px; }
.card { background:#2b2e36; border-radius:12px; padding:15px; margin-bottom:12px; line-height:1.75; font-size:14.5px; animation:fade .22s ease; }
@keyframes fade { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:none} }
.card.sys { border-left:4px solid #b8a878; background:#2f2c25; }
.card.meal { border-left:4px solid #c49b5b; }
.card.action { border-left:4px solid #6f9bc9; }
.card.beat { border-left:4px solid #b87a9a; }
.card.bill { border-left:4px solid #6aa88a; background:#24302b; }
.card.ending { border-left:4px solid #b8a878; }
.kicker { color:#8d98aa; font-size:12px; margin-bottom:6px; }
.title { font-weight:700; font-size:16px; margin-bottom:5px; }
.text { color:#c8c2b6; }
.btn { display:block; width:100%; margin-top:9px; padding:11px 12px; text-align:left; border:1px solid #444850; border-radius:9px; background:#343841; color:#e6e1d8; font-size:14px; line-height:1.45; cursor:pointer; }
.btn:active { background:#3d424d; }
.btn:disabled { opacity:.42; cursor:not-allowed; }
.btn .meta { float:right; color:#d08d6d; font-size:12px; margin-left:8px; }
.btn .meta.free { color:#7d8c7e; }
.lines { margin-top:10px; font-size:13px; }
.line { display:flex; justify-content:space-between; gap:10px; padding:3px 0; border-bottom:1px dotted #3a3e46; }
.line.in { color:#83bd8e; } .line.out { color:#d88d7a; } .line.stam { color:#9fb7d8; }
.section-title { color:#b8a878; font-size:13px; margin:12px 0 6px; }
.kv { display:flex; justify-content:space-between; border-bottom:1px dashed #3a3d44; padding:5px 0; font-size:13.5px; }
.kv span:first-child { color:#918b80; }
.bar { height:7px; background:#3a3d44; border-radius:4px; overflow:hidden; margin:4px 0 8px; }
.bar i { display:block; height:100%; background:#6aa88a; }
.tabs { position:fixed; bottom:0; width:100%; max-width:430px; display:flex; background:#1f2127; border-top:1px solid #34373e; }
.tab { flex:1; padding:12px 0; border:0; background:transparent; color:#858075; font-size:13px; cursor:pointer; }
.tab.on { color:#c9b88a; }
.empty { color:#777; text-align:center; padding:30px 0; }

.bar i.good { background:#6aa88a; }
.bar i.warn { background:#c4a15d; }
.bar i.bad { background:#d07167; }
.card.panel .kv b { max-width:68%; text-align:right; }

.life-choice { position:relative; padding-right:110px; }
.life-choice span { font-weight:600; }
.life-choice .choice-detail { display:block; float:none; color:#918b80; font-size:12px; line-height:1.45; margin-top:3px; }
.life-choice:disabled { opacity:.55; }
