/* Mobile readability layer — Grace & Grow public share v1.0.0 (based on v1.6.2) */
html{font-size:20px}
.topbar{height:108px;padding-left:76px;padding-right:76px;position:relative;justify-content:center}
.topbar>.icon-btn:first-child{position:absolute;left:18px}
#installBtn{position:absolute;right:18px}
.brand{display:block;position:relative;text-align:center}
.brand h1{font-size:2.2rem;line-height:1.08;letter-spacing:.06em}
.brand p{font-size:1.2rem;line-height:1.25;letter-spacing:.1em}
.brand-mark{width:58px!important;height:58px!important;border-radius:17px!important;position:absolute;right:calc(100% + 14px);top:50%;transform:translateY(-50%)}
.icon-btn{width:50px;height:50px;font-size:1.7rem}
.blessing{font-size:1.4rem;line-height:1.6;margin:14px 8px 24px}
.blessing span{white-space:nowrap}
.mobile-break{display:none}
.month-switch{gap:18px;margin-bottom:18px}
.month-switch strong{font-size:1.6rem;letter-spacing:.04em;white-space:nowrap}
.month-switch button{width:52px;height:48px;font-size:1.7rem}
.carryover-card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:3px 14px;margin:0 0 12px;padding:14px 18px;border:1px solid var(--line);border-radius:20px;background:rgba(255,253,250,.86)}
.carryover-card span{font-size:1.05rem;font-weight:700;color:var(--muted)}
.carryover-card strong{font:700 1.45rem Georgia,serif;color:var(--rose-dark)}
.carryover-card small{grid-column:1/-1;font-size:.82rem;color:var(--muted);line-height:1.45}
.hero-card{padding:25px 18px;border-radius:26px}
.hero-card span{font-size:1.55rem}
.hero-card strong{font-size:3.15rem;line-height:1.2;margin:6px 0}
.hero-card small{font-size:1.15rem;line-height:1.5}
.summary-grid{gap:11px;margin:14px 0 30px}
.summary-grid article{padding:20px 14px;min-height:142px}
.summary-grid article{cursor:pointer;transition:border-color .18s,box-shadow .18s,transform .18s}
.summary-grid article:active{transform:scale(.985)}
.summary-grid article.active{border-color:#b9787d;box-shadow:0 0 0 3px rgba(168,95,100,.13)}
.summary-grid article:focus-visible{outline:3px solid rgba(168,95,100,.28);outline-offset:2px}
.summary-grid span{font-size:1.3rem;line-height:1.3;margin-bottom:10px}
.summary-grid strong{font-size:1.9rem;line-height:1.2}
.section-head{align-items:flex-start;flex-direction:column;gap:12px}
.section-head h2,.page-title h2{font-size:1.9rem}
.segmented{align-self:stretch;display:grid;grid-template-columns:repeat(3,1fr)}
.segmented button{font-size:1.1rem;padding:11px 8px}
.transaction{grid-template-columns:70px 1fr auto;gap:12px;padding:17px 3px}
.date-badge{font-size:1.1rem;font-weight:600;white-space:nowrap}
.transaction h3{font-size:1.15rem;line-height:1.35}
.transaction p{font-size:1.1rem;line-height:1.4;font-weight:500}
.transaction .amount{font-size:1.2rem}
.status{font-size:.8rem;padding:5px 9px}
.empty{font-size:1.35rem;line-height:1.65;padding:42px 18px}
.page-title p{font-size:1rem;line-height:1.6}
.form-card{padding:20px}
.form-card>label,legend{font-size:1.05rem}
.form-card input,.form-card textarea,.form-card select{font-size:1.05rem;min-height:58px}
.money-input span{font-size:1.45rem;top:20px}
.money-input input{font-size:2rem}
.suggestions button{font-size:.9rem;padding:10px 14px}
.choice{font-size:1rem;padding:15px 8px}
.form-card>.primary{font-size:1.05rem;min-height:58px}
.helper,.field-help{font-size:.9rem!important}
.schedule-choice{margin-bottom:18px}
.single-date-fields>label,.recurring-fields>label,.month-range label{display:block;font-size:1.05rem;font-weight:700}
.single-date-fields{margin-bottom:15px}
.recurring-fields{margin:-2px 0 18px;padding:16px;border:1px solid var(--line);border-radius:18px;background:#faf5f2}
.recurring-fields .helper{margin:13px 2px 0}
.month-range{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.recurring-badge{display:inline-block;margin-left:8px;padding:2px 7px;border-radius:10px;background:#eee5df;color:var(--rose-dark);font-size:.72rem;font-weight:700;vertical-align:2px;white-space:nowrap}
.action-list strong{font-size:1.15rem}
.action-list small{font-size:.85rem;line-height:1.5}
.privacy-note{font-size:1rem}
.bottom-nav button{font-size:1.05rem;line-height:1.2}
.bottom-nav span{font-size:1.8rem;margin-bottom:5px}
.fab{width:64px;height:64px;font-size:2rem}
.modal-card h3{font-size:1.35rem}
.modal-card p,.period-choices label{font-size:1rem}
@media(max-width:520px){
  .mobile-break{display:block}
}
@media(max-width:390px){
  main{padding:0 14px}
  .topbar{padding-left:62px;padding-right:62px}
  .topbar>.icon-btn:first-child{left:8px}
  #installBtn{right:8px}
  .brand h1{font-size:1.9rem}
  .brand p{font-size:1.05rem}
  .brand-mark{width:52px!important;height:52px!important}
  .summary-grid strong{font-size:1.7rem}
  .hero-card strong{font-size:2.8rem}
  .carryover-card strong{font-size:1.3rem}
  .month-range{grid-template-columns:1fr}
}
@media(min-width:700px){
  .section-head{align-items:center;flex-direction:row}
  .segmented{align-self:auto;display:flex}
  .summary-grid article{min-height:120px}
  .summary-grid strong{font-size:1.55rem}
}
