/* ---- about card (bottom of Settings/More, below the Install card · SUITE-STANDARDS §1 · kit v3.1) ---- */
.mb-about{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;margin-top:12px;border:1px solid var(--border);border-left:3px solid var(--accent);
  border-radius:var(--r);background:var(--surface)}
.mb-about>.uic{flex:none;width:22px;height:22px;color:var(--accent)}
.mb-about>div{flex:1;min-width:0}
.mb-about b{display:block;font-size:14px;font-weight:600;color:var(--ink)}
.mb-about p{margin:2px 0 0;font-size:12.5px;color:var(--ink-2)}
.mb-about .mb-about-links{display:flex;flex-wrap:wrap;gap:0 14px;margin-top:4px}
.mb-about .mb-about-links a,.mb-about .mb-about-links button{display:inline-flex;align-items:center;min-height:28px;padding:0;border:0;background:none;
  font:inherit;color:var(--accent);text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.mb-about .mb-about-links a:hover,.mb-about .mb-about-links button:hover{color:var(--accent-hover)}
.mb-about .mb-about-copy{margin-top:4px;color:var(--muted,var(--ink-2))}

/* =====================================================================
   mbpayday.online · MB Suite v2 cutouts + v3 adapter. Loads last.
   Banner NA-06 Hills (sun over rolling hills: a workday) · empty states NA-16 Seed Pair · share card NA-06.
   ===================================================================== */
/* gradient surfaces mapped to this app's selectors (v2 §3): hero tile = first stat on Overview */
.cards .card.cu-hero{background:var(--g-tile)}
.cu-banner{max-width:none}
.cu-banner .cu-s{max-width:60ch}

/* page bar */
.page-bar .actions{flex-wrap:nowrap}
.page-bar .actions .btn.primary{min-width:0}
/* the page bar names the view on desktop/tablet; the in-view h2 is for phones (and the heading outline) */
.view-head h2{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:767px){
  .view-head h2{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:normal}
  /* keep the h1 for screen readers instead of display:none */
  .page-bar .page-title{display:block;position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0)}
  .page-bar .actions{gap:6px}
  .phone-search{display:block;margin:0 0 12px}
}
@media (min-width:768px){.phone-search{display:none}}
.phone-search .searchbox input{width:100%;height:var(--ctl)}
@media (max-width:480px){
  #dataBtn .lbl,#dataBtn .chev{display:none}
  #dataBtn{padding:0 10px;min-width:44px}
}
@media (max-width:767px){.page-bar .phone-brand{min-height:44px}}
@media (max-width:480px){
  #headerClock .uic,#headerClock .amt{display:none}
  #headerClock{padding:0 12px}
}
.store-banner{margin-left:max(var(--gutter),calc((100% - var(--page-max)) / 2 + var(--gutter)));margin-right:max(var(--gutter),calc((100% - var(--page-max)) / 2 + var(--gutter)))}