:root {
  --bg:#f3f6fb;
  --card:#ffffff;
  --text:#0f172a;
  --muted:#64748b;
  --line:#e2e8f0;
  --primary:#2563eb;
  --danger:#dc2626;
  --good:#059669;
  --warn:#d97706;
  --shadow:0 10px 30px rgba(15,23,42,.08);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
body{padding-bottom:86px}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.app-shell{max-width:780px;margin:0 auto}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:22px 18px 10px}
.eyebrow{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:12px;font-weight:700}
h1{font-size:28px;margin:4px 0 0}
h2,h3{margin:0}
main{padding:10px 14px 30px}
.view{display:none}
.view.active{display:block}
.hero-card{background:linear-gradient(135deg,#0f172a,#1e3a8a);color:#fff;padding:24px;border-radius:24px;box-shadow:var(--shadow);margin-bottom:14px}
.hero-label{opacity:.75;font-size:14px}
.hero-value{font-size:40px;font-weight:800;margin-top:8px}
.hero-hint{opacity:.72;margin-top:6px;font-size:13px}
.grid-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.metric{background:var(--card);border-radius:18px;padding:16px;box-shadow:var(--shadow)}
.metric span{display:block;color:var(--muted);font-size:13px;margin-bottom:8px}
.metric strong{font-size:20px}
.panel{background:var(--card);border-radius:20px;padding:16px;margin-top:14px;box-shadow:var(--shadow)}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.sticky-head{position:sticky;top:0;background:var(--bg);padding:10px 0;z-index:4}
.stack{display:grid;gap:10px}
.item{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px}
.item-row{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.item-title{font-weight:800}
.item-sub{color:var(--muted);font-size:13px;margin-top:4px}
.amount{font-weight:800;white-space:nowrap}
.badge{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;font-size:12px;font-weight:700;background:#e2e8f0;color:#334155}
.badge.red{background:#fee2e2;color:#991b1b}
.badge.green{background:#d1fae5;color:#065f46}
.badge.orange{background:#ffedd5;color:#9a3412}
.primary,.ghost{border:0;border-radius:12px;padding:10px 14px;font-weight:800}
.primary{background:var(--primary);color:white}
.ghost{background:#e2e8f0;color:#334155}
.ghost.danger{color:var(--danger)}
.wide{width:100%;padding:14px}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;background:rgba(255,255,255,.96);backdrop-filter:blur(18px);display:flex;justify-content:center;border-top:1px solid var(--line);padding:8px max(8px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));z-index:10}
.nav-btn{flex:1;max-width:156px;border:0;background:transparent;padding:10px 4px;color:var(--muted);font-size:12px;font-weight:700}
.nav-btn.active{color:var(--primary)}
dialog{border:0;border-radius:22px;width:min(94vw,560px);padding:0;box-shadow:0 30px 100px rgba(15,23,42,.3)}
dialog::backdrop{background:rgba(15,23,42,.45);backdrop-filter:blur(2px)}
#modalForm{padding:18px}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.form-grid{display:grid;gap:12px;margin-bottom:16px}
label{display:grid;gap:6px;color:#334155;font-weight:700;font-size:13px}
input,select,textarea{width:100%;border:1px solid #cbd5e1;border-radius:12px;padding:12px;background:#fff;color:var(--text)}
.empty{padding:18px;text-align:center;color:var(--muted);border:1px dashed #cbd5e1;border-radius:14px}
.actions{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.small{padding:8px 10px;font-size:12px}
.good{color:var(--good)}
.bad{color:var(--danger)}
@media (min-width:700px){
  .grid-cards{grid-template-columns:repeat(4,1fr)}
}

.header-actions{display:flex;gap:8px}
.cloud-status{margin:0 18px 8px;padding:8px 12px;border-radius:12px;background:#e2e8f0;color:#475569;font-size:12px;font-weight:700}
.cloud-status.online{background:#d1fae5;color:#065f46}
.cloud-status.error{background:#fee2e2;color:#991b1b}