:root{
  --green:#2e7d32; --green-dark:#1b5e20; --bg:#f2f5f2; --card:#ffffff;
  --text:#212121; --muted:#757575; --line:#e0e0e0; --red:#c62828; --amber:#ef6c00;
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
body{margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  background:var(--bg); color:var(--text); font-size:16px; line-height:1.45;}
#app{max-width:760px; margin:0 auto; min-height:100vh; background:var(--bg);}
.loading{padding:40px; text-align:center; color:var(--muted);}
.topbar{position:sticky; top:0; z-index:10; background:var(--green); color:#fff;
  display:flex; align-items:center; gap:8px; padding:12px 14px;}
.topbar h1{font-size:19px; margin:0; flex:1; font-weight:600;}
.topbar .back{background:none; border:none; color:#fff; font-size:24px; padding:4px 10px 4px 0; cursor:pointer;}
.topbar .iconbtn{background:none; border:none; color:#fff; font-size:20px; padding:6px; cursor:pointer;}
.page{padding:14px 14px 90px;}
.card{background:var(--card); border-radius:12px; padding:14px; margin-bottom:12px;
  box-shadow:0 1px 3px rgba(0,0,0,.08);}
.card h2{margin:0 0 10px; font-size:17px;}
.kv{display:flex; justify-content:space-between; gap:10px; padding:7px 0; border-bottom:1px solid var(--line);}
.kv:last-child{border-bottom:none;}
.kv .k{color:var(--muted); flex-shrink:0;}
.kv .v{text-align:right; word-break:break-word;}
.btn{display:block; width:100%; padding:14px; margin:8px 0; border:none; border-radius:12px;
  font-size:16px; font-weight:600; cursor:pointer; background:#e8e8e8; color:var(--text);}
.btn-primary{background:var(--green); color:#fff;}
.btn-danger{background:var(--red); color:#fff;}
.btn-warn{background:var(--amber); color:#fff;}
.btn-row{display:flex; gap:8px;}
.btn-row .btn{flex:1;}
.btn-small{padding:8px 10px; font-size:14px; margin:4px 0;}
.home-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:14px;}
.home-btn{background:var(--card); border:none; border-radius:16px; padding:28px 10px;
  font-size:18px; font-weight:700; color:var(--green-dark); cursor:pointer;
  box-shadow:0 2px 6px rgba(0,0,0,.1); display:flex; flex-direction:column; align-items:center; gap:8px;}
.home-btn .sub{font-size:12px; font-weight:400; color:var(--muted);}
input,select,textarea{width:100%; padding:12px; margin:4px 0 12px; border:1px solid #bdbdbd;
  border-radius:10px; font-size:16px; background:#fff; color:var(--text);}
textarea{min-height:80px; resize:vertical;}
label{font-weight:600; font-size:14px; color:#424242;}
.searchrow{margin-bottom:10px;}
.filterstrip{display:flex; gap:8px; overflow-x:auto; padding:4px 2px 10px; -webkit-overflow-scrolling:touch;}
.filterstrip select{width:auto; min-width:120px; margin:0; padding:10px; font-size:14px; flex-shrink:0;}
.pill{flex-shrink:0; padding:10px 14px; border-radius:20px; border:1px solid #bdbdbd;
  background:#fff; font-size:14px; cursor:pointer; margin:0;}
.pill.on{background:var(--green); color:#fff; border-color:var(--green);}
.pill:disabled,.filterstrip select:disabled{opacity:.4;}
.listrow{background:var(--card); border-radius:12px; padding:12px 14px; margin-bottom:8px;
  display:flex; align-items:center; gap:12px; cursor:pointer; box-shadow:0 1px 3px rgba(0,0,0,.06);}
.listrow .nm{font-weight:700; font-size:16px;}
.listrow .meta{color:var(--muted); font-size:13px;}
.listrow .thumb{width:52px; height:52px; border-radius:10px; object-fit:cover; flex-shrink:0; background:#eee;}
.listrow .grow{flex:1; min-width:0;}
.charts{display:flex; gap:12px; margin-bottom:12px;}
.chart-card{flex:1; background:var(--card); border-radius:12px; padding:10px; text-align:center;
  box-shadow:0 1px 3px rgba(0,0,0,.08);}
.chart-card h3{margin:0 0 6px; font-size:14px; color:#424242;}
.donut{width:100%; max-width:150px; height:auto;}
.donut-c{font-size:7px; font-weight:700; fill:var(--text); text-anchor:middle; dominant-baseline:middle;}
.legend{text-align:left; font-size:12px; margin-top:6px;}
.legend div{display:flex; align-items:center; gap:6px; padding:1px 0;}
.dot{width:10px; height:10px; border-radius:50%; flex-shrink:0;}
.photos{display:flex; gap:8px; flex-wrap:wrap; margin:8px 0;}
.photos img{width:80px; height:80px; object-fit:cover; border-radius:10px;}
.photowrap{position:relative;}
.photowrap button{position:absolute; top:-8px; right:-8px; width:26px; height:26px; border-radius:50%;
  border:none; background:var(--red); color:#fff; font-size:14px; cursor:pointer; line-height:1;}
.evrow{background:var(--card); border-radius:10px; padding:12px; margin-bottom:8px;}
.evrow .d{color:var(--muted); font-size:13px;}
.evrow .t{font-weight:700;}
.evrow .n{font-size:14px; margin-top:4px; white-space:pre-wrap;}
.evrow .ops{margin-top:8px; display:flex; gap:8px;}
.linkbtn{background:none; border:none; color:var(--green); font-size:14px; font-weight:600; cursor:pointer; padding:4px 0;}
.linkbtn.red{color:var(--red);}
.badge{display:inline-block; padding:2px 10px; border-radius:12px; font-size:12px; font-weight:700;}
.badge.in{background:#e8f5e9; color:var(--green-dark);}
.badge.out{background:#fce4ec; color:var(--red);}
.txn-amt{font-weight:700; font-size:16px;}
.status{padding:10px; border-radius:10px; background:#e8f5e9; color:var(--green-dark);
  font-size:14px; margin:8px 0; white-space:pre-wrap;}
.status.err{background:#fce4ec; color:var(--red);}
.note{font-size:13px; color:var(--muted); margin:8px 0;}
h2.sec{font-size:18px; margin:4px 0 12px;}
.empty{color:var(--muted); text-align:center; padding:24px 10px;}
.kidrow{border:1px solid var(--line); border-radius:10px; padding:10px; margin-bottom:10px;}
.kidrow h4{margin:0 0 6px;}
.fab{position:fixed; bottom:20px; right:20px; width:60px; height:60px; border-radius:50%;
  background:var(--green); color:#fff; font-size:32px; border:none; cursor:pointer;
  box-shadow:0 4px 10px rgba(0,0,0,.25); line-height:1;}
input[readonly]{background:#fafafa; cursor:pointer;}
#lp-overlay{position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:60;
  display:flex; align-items:flex-end; justify-content:center;}
.lp-sheet{background:#fff; width:100%; max-width:760px; max-height:82vh; overflow-y:auto;
  border-radius:18px 18px 0 0; padding:18px 16px 26px;}
.lp-sheet h3{margin:0 0 10px; font-size:17px;}
.lp-list{margin:6px 0 12px; max-height:44vh; overflow-y:auto;
  border:1px solid var(--line); border-radius:10px;}
.lp-item{padding:13px 12px; border-bottom:1px solid var(--line); font-size:16px; cursor:pointer;}
.lp-item:last-child{border-bottom:none;}
.lp-item:active{background:#e8f5e9;}