html, body { height: 100%; }
body {
  background:#f5f7fb; color:#222;
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
}

.app-shell {
  max-width: 480px;
  margin: 0 auto;
  min-height: 100vh;
  background:#f5f7fb;
}

.app-header {
  position: sticky; top:0; z-index: 50;
  background:#111827; color:#fff;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.app-header .title { font-size:16px; font-weight:700; margin:0; }
.app-header .subtitle { font-size:12px; opacity:.85; margin:2px 0 0; }

.card {
  background:#fff;
  border:1px solid #e7eaf0;
  border-radius:14px;
  padding:12px;
  margin:12px 12px 0;
  box-shadow:0 6px 18px rgba(17,24,39,.05);
}

.card-title {
  font-size:13px;
  font-weight:700;
  margin:0 0 10px;
  color:#111827;
}

.app-bottom {
  position: sticky;
  bottom: 0;
  z-index: 40;
  background: rgba(245,247,251,0.95);
  padding: 10px 12px 14px;
  border-top: 1px solid #e6eaf2;
}