/* Android app: account page laid out like a phone app (built by app-entry.js, only when the user agent says LedgerApp) */
.ipanel { display: none; }

/* ---- screen: header / ledger (scrolls) / totals / entry panel */
html.inapp-entry, html.inapp-entry body { height: 100%; overflow: hidden; }
html.inapp-entry .topbar, html.inapp-entry .pagebar, html.inapp-entry .dock, html.inapp-entry .sidebar,
html.inapp-entry .acctpane, html.inapp-entry .wspane > .summary, html.inapp-entry form.quickbar,
html.inapp-entry .ledger > header, html.inapp-entry .ledger .lhead { display: none !important; }
html.inapp-entry .shell, html.inapp-entry .main, html.inapp-entry .scroller, html.inapp-entry .container, html.inapp-entry .wspane {
  display: flex; flex-direction: column; min-height: 0; margin: 0; padding: 0; max-width: none; overflow: hidden; }
html.inapp-entry .shell { height: calc(100dvh - var(--ipanel-h, 21rem)); }
html.inapp-entry .main, html.inapp-entry .scroller, html.inapp-entry .container, html.inapp-entry .wspane { flex: 1 1 0; }
html.inapp-entry .wspane > * { flex: none; }
html.inapp-entry .wspane > .ledger { flex: 1 1 0; min-height: 5rem; overflow-y: auto; margin: 0; border-radius: 0; box-shadow: none; background: var(--surface); }
html.inapp-entry .wspane > .menupanel { flex: none; }

/* messages ("Expense saved.") float over the top and fade away */
html.inapp-entry .flashes { position: fixed; top: calc(.5rem + env(safe-area-inset-top)); left: .6rem; right: .6rem; z-index: 80; pointer-events: none; }
html.inapp-entry .flashes .flash { margin: 0 0 .4rem; box-shadow: 0 4px 14px rgba(0, 0, 0, .18); transition: opacity .4s; }

/* ---- header */
html.inapp-entry .wshead { display: flex; align-items: center; gap: .6rem; padding: calc(.6rem + env(safe-area-inset-top)) 1rem .6rem; background: var(--surface); color: var(--text); border-bottom: 1px solid var(--border); justify-content: flex-start; }
html.inapp-entry .wshead h1 { display: block; flex: 1; margin: 0; font-size: 1.2rem; font-weight: 700; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.inapp-entry .wshead h1 small, html.inapp-entry .wshead .wsbal, html.inapp-entry .wshead .wsnav { display: none; }
html.inapp-entry .ihome { flex: none; display: grid; place-items: center; width: 2.9rem; height: 2.9rem; border-radius: 50%; background: color-mix(in srgb, var(--ok, #2f855a) 18%, var(--surface)); color: var(--ok, #2f855a); }
html.inapp-entry .ishare { flex: none; display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border: 0; background: none; color: var(--brand-2); }
html.inapp-entry .wshead .menubtn { display: inline-block; border: 0; background: none; border-radius: 0; padding: .4rem .3rem; color: var(--brand-2); font: inherit; font-size: .95rem; font-weight: 600; }

/* ---- ledger rows (screenshot style) */
html.inapp-entry .ledger a.row.txn, html.inapp-entry .ledger .row.txn.opening { display: flex; justify-content: space-between; align-items: flex-start; gap: .8rem; padding: .6rem .9rem; border-bottom: 1px solid color-mix(in srgb, var(--border) 60%, transparent); color: var(--text); text-decoration: none; }
html.inapp-entry .ledger .r-main { display: flex; flex-direction: column; gap: .12rem; min-width: 0; }
html.inapp-entry .ledger .r-top { display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .4rem; text-transform: uppercase; letter-spacing: .02em; }
html.inapp-entry .ledger .r-kind { font-size: .8rem; font-weight: 600; }
html.inapp-entry .ledger .r-kind.out, html.inapp-entry .ledger .r-amt.out { color: var(--out, #b3321f); }
html.inapp-entry .ledger .r-kind.in, html.inapp-entry .ledger .r-amt.in { color: var(--in, #1f7a45); }
html.inapp-entry .ledger .r-when { font-size: .7rem; color: var(--muted); }
html.inapp-entry .ledger .r-cat { font-size: .85rem; text-transform: uppercase; }
html.inapp-entry .ledger .r-cat.none { color: var(--muted); }
html.inapp-entry .ledger .r-to { font-size: .85rem; color: var(--brand-2); }
html.inapp-entry .ledger .r-desc { font-size: .8rem; color: var(--muted); overflow-wrap: anywhere; }
html.inapp-entry .ledger .r-amt { flex: none; font-size: 1.15rem; font-weight: 600; line-height: 1.15; }
html.inapp-entry .ledger .rowacts { background: var(--surface-2); }

/* ---- totals, straight above the panel */
html.inapp-entry .wstotals { margin: 0; padding: 0; background: var(--surface); border-radius: 0; box-shadow: none; display: block; }
html.inapp-entry .wstotals > div { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; padding: .7rem 1.1rem; font-size: .85rem; }
html.inapp-entry .wstotals > div:first-child { background: var(--surface-2); text-transform: uppercase; }
html.inapp-entry .wstotals .lab { flex: 1; text-transform: uppercase; font-size: .8rem; font-weight: 600; color: var(--muted); letter-spacing: .02em; }
html.inapp-entry .wstotals > div:last-child { padding: .8rem 1.1rem; }
html.inapp-entry .wstotals > div:last-child > :not(.lab):not(b) { display: none; }
html.inapp-entry .wstotals > div:last-child b { font-size: 1.3rem; font-weight: 500; }

/* ---- docked entry panel */
html.inapp-entry .ipanel {
  display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
  background: var(--brand-soft); border-top: 3px solid var(--brand-2); border-radius: 14px 14px 0 0;
  padding: .55rem .6rem calc(.5rem + env(safe-area-inset-bottom)); box-shadow: 0 -6px 18px rgba(0, 0, 0, .14);
}
.ipanel [hidden] { display: none !important; }
.ipanel .irow1 { display: flex; gap: .5rem; align-items: stretch; }
.ipanel .idisp { flex: 1; min-width: 0; display: flex; align-items: center; justify-content: flex-end; padding: 0 .8rem; background: var(--surface); border-radius: 8px; min-height: 3.2rem; overflow: hidden; }
.ipanel .iexpr { font-size: 1.7rem; font-weight: 600; color: var(--muted); white-space: nowrap; }
.ipanel .idisp.has .iexpr { color: var(--text); }
.ipanel .isave { flex: 0 0 38%; border: 0; border-radius: 8px; font: inherit; font-size: 1.05rem; font-weight: 700; letter-spacing: .05em; background: var(--brand-2); color: #fff; }
.ipanel .isave:disabled { background: #6b7780; color: rgba(255, 255, 255, .75); }
.ipanel .iacctrow { display: flex; gap: .4rem; margin-top: .45rem; }
.ipanel .iacct { flex: 1; min-width: 0; padding: .6rem .8rem; text-align: left; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--text); font: inherit; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ipanel .iacct.empty { color: var(--brand-2); }
.ipanel .iswap { flex: none; width: 3rem; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--brand-2); display: grid; place-items: center; }
.ipanel .inote { display: block; width: 100%; box-sizing: border-box; margin-top: .45rem; padding: .6rem .8rem; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--text); font: inherit; }
.ipanel .icancel { display: block; margin: .4rem 0 0 auto; background: none; border: 0; color: var(--brand-2); font: inherit; font-weight: 600; }
.ipanel .itabs { display: flex; gap: .2rem; overflow-x: auto; margin-top: .3rem; scrollbar-width: none; }
.ipanel .itabs::-webkit-scrollbar { display: none; }
.ipanel .itabs button { flex: none; background: none; border: 0; border-bottom: 3px solid transparent; padding: .6rem .8rem; font: inherit; font-size: .95rem; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--muted); }
.ipanel .itabs button.on { color: var(--text); border-bottom-color: var(--brand-2); }
.ipanel .iops { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; margin-top: .3rem; }
.ipanel .iops button { padding: .5rem 0; border: 0; border-radius: 6px; background: var(--surface-2); color: var(--text); font: inherit; font-size: 1.3rem; }
.ipanel .ikeys { display: grid; grid-template-columns: repeat(5, 1fr); grid-auto-rows: 3.2rem; gap: 1px; margin-top: .3rem; background: var(--border); border-radius: 10px; overflow: hidden; }
.ipanel .ikey { position: relative; display: grid; place-items: center; box-sizing: border-box; height: 100%; margin: 0; border: 0; background: var(--surface); color: var(--text); font: inherit; font-size: 1.6rem; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.ipanel .ikey:active { background: var(--brand-soft); }
.ipanel .ical.set { color: var(--brand-2); }
.ipanel .idate { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; border: 0; }

/* ---- Android app: compact credit-card summary (list) and card strip (account page) ---- */
html.inapp .kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .3rem; margin: .35rem .5rem; }
html.inapp .kpi { padding: .3rem .4rem; border-radius: 8px; }
html.inapp .kpi small { font-size: .55rem; letter-spacing: .02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.inapp .kpi b { font-size: .72rem; }
html.inapp a.cardrow { padding: .45rem .7rem; margin: 0 .5rem .4rem; border-radius: 10px; }
html.inapp .cardrow-head { margin-bottom: .15rem; font-size: .9rem; }
html.inapp .cardrow .pill { font-size: .6rem; padding: .05rem .4rem; }
html.inapp .cardrow .meter { height: 5px; margin: .1rem 0 .25rem; }
html.inapp .cardrow .kv { padding: .12rem 0; font-size: .78rem; }
html.inapp .cardrow .kv b { font-size: .85rem; }
html.inapp .cardrow .hint { margin: .15rem 0 0; font-size: .7rem; }
html.inapp .infostrip { display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .4rem; padding: .25rem .55rem; font-size: .7rem; line-height: 1.25; margin: .25rem .5rem; border-radius: 8px; flex: none; }
html.inapp .infostrip .is-main { flex: 1 1 100%; min-width: 0; }
html.inapp .infostrip .meter { flex: 1 1 100%; height: 3px; margin: 0; }
html.inapp .infostrip .pill { font-size: .6rem; padding: .02rem .4rem; margin: 0; }
html.inapp .infostrip .chip { padding: .1rem .5rem; font-size: .66rem; line-height: 1.3; white-space: nowrap; }
html.inapp .infostrip .muted { font-size: .65rem; }
html.inapp .infostrip a.chip[href*="card_bill"] { display: none; }
html.inapp-entry .ledger .row.txn.opening { background: var(--surface-2); }
html.inapp-entry .ledger .row.txn.opening .r-kind { color: var(--muted); }
html.inapp-entry .ledger .row.txn.opening .r-amt { color: var(--text); }

.ipanel .iwords { padding: 0 .9rem; min-height: 1rem; font-size: .72rem; color: var(--muted); text-align: left; line-height: 1.2; }