/* Shared control geometry for merchant, member, entry and checkout surfaces. */
body button, body :is(.btn,.primary,.secondary,.primary-action,.small-action,.reward-action,.event-action,.passport-choose,.entrance-button,.alt,.join-login-link) {
 box-sizing:border-box; min-height:44px; min-width:44px; max-width:100%;
 line-height:1.35; white-space:normal; overflow-wrap:break-word; touch-action:manipulation;
}
body :is(.btn,.primary,.secondary,.primary-action,.small-action,.reward-action,.event-action,.passport-choose,.entrance-button,.alt) {
 display:inline-flex; align-items:center; justify-content:center; gap:8px;
 padding:10px 18px; text-align:center; font-size:15px; vertical-align:middle;
}
body :is(.text-link,.all-rewards-link,.linkbtn,.textbtn,.signout-button,.join-login-link) {
 min-height:44px; display:inline-flex; align-items:center; gap:6px; line-height:1.35;
}
body :is(button,.btn,.primary,.secondary,.entrance-button) svg { flex-shrink:0; }
body :is(.iconbtn,.panel-close,.member-panel-close,.feedback-close) {
 width:44px; height:44px; min-width:44px; min-height:44px; padding:0;
 display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
}
body :is(.modalactions,.setup-actions,.reward-confirm-actions,.merchant-wallet-actions,.entry-choice-actions) { flex-wrap:wrap; gap:12px; }
body :is(.headline,.pageheading,.panel-title,.section-heading) { flex-wrap:wrap; }
body :is(.headline,.pageheading,.panel-title,.section-heading)>div { min-width:0; }
body .billing-plans { grid-template-columns:repeat(3,minmax(0,1fr)); }
body .billing-plans :is(section,button) { min-width:0; }
body .billing-plans button { width:100%; }
body :is(.modal,.member-feedback-dialog,.reward-confirm) :is(h2,h3) { padding-right:52px; }
/* Give carousel dots a full hit area while keeping the visible mark small. */
body .boost-dots { flex-wrap:wrap; gap:0; }
body .boost-dots button,body .boost-dots button[aria-current='true'] {
 position:relative; width:44px; height:44px; padding:0; background:transparent;
}
body .boost-dots button::before { content:''; display:block; width:8px; height:8px; margin:auto; border-radius:99px; background:var(--member-line,#e3e8e0); }
body .boost-dots button[aria-current='true']::before { width:22px; background:var(--member-green,#315e4a); }
#choplah-cookie-preferences { min-height:44px; padding:8px 12px!important; font-size:12px!important; bottom:8px!important; border-radius:12px!important; }
body:has(.member-bottom-nav) #choplah-cookie-preferences,
body:has(.member-bottom-nav) #choplah-cookie-choice { bottom:calc(100px + env(safe-area-inset-bottom))!important; }
@media(max-width:760px) {
 body :is(button,.btn,.primary,.secondary,.primary-action,.small-action,.reward-action,.event-action,.passport-choose,.entrance-button,.alt,.join-login-link) { min-height:48px; }
 body :is(.btn,.primary,.secondary,.primary-action,.small-action,.reward-action,.event-action,.passport-choose,.entrance-button,.alt) { padding:12px 16px; }
 body :is(.iconbtn,.panel-close,.member-panel-close,.feedback-close) { width:48px; height:48px; min-width:48px; padding:0; }
 body .billing-plans { grid-template-columns:1fr; }
 body .topright { width:100%; min-width:0; overflow:visible; }
 body .viewtoggle { display:flex; max-width:100%; flex-wrap:wrap; }
 body .viewtoggle button { min-width:0; flex:1 1 auto; }
 body .member-bottom-nav { padding-inline:8px; gap:4px; }
 body .member-bottom-nav button { min-width:44px; min-height:48px; padding:8px 4px; gap:4px; }
 body .member-header-right { flex-wrap:wrap; justify-content:flex-end; gap:8px; min-width:0; }
 body .boost-dots button,body .boost-dots button[aria-current='true'] { width:48px; height:48px; }
 #choplah-cookie-preferences { min-height:48px; }
}
@media(max-width:480px) {
 body :is(.modalactions,.setup-actions,.reward-confirm-actions,.entry-choice-actions) { display:flex; }
 body :is(.modalactions,.setup-actions,.reward-confirm-actions,.entry-choice-actions)>:is(button,a.btn,.primary,.secondary,.small-action) { flex:1 1 100%; width:100%; }
 body .member-header { height:auto; min-height:80px; padding-block:12px; gap:12px; flex-wrap:wrap; }
 body .member-app :is(.small-action,.reward-action,.event-action,.primary-action,.passport-choose) { font-size:14px!important; }
 body .member-bottom-nav button { font-size:11px!important; }
 body .profile-form .primary-action { justify-self:stretch; }
}
@media(max-width:480px) {
 body .top .wrap { flex-wrap:wrap; gap:12px; }
 body .top .landing-logo { width:112px; max-width:100%; }
 body .top .wrap>:last-child { flex-wrap:wrap; min-width:0; gap:8px!important; }
 body .top :is(.btn,.login-link),body .top .wrap>div>a { white-space:nowrap; min-height:48px; }
 body .top .wrap>div>a:not(.btn) { display:inline-flex; align-items:center; }
 body .top .btn { padding:10px 14px; }
}
body .show-password { min-height:44px; top:2px; }
@media(max-width:760px) { body .show-password { min-height:48px; top:0; } }
@media(max-width:480px) {
 body .top .wrap { width:calc(100% - 32px); padding-inline:0; flex-wrap:nowrap; }
 body .top .wrap>.brand,body .top .wrap>.wordmark { flex-shrink:0; }
}
@media(max-width:480px) {
 body .top .wrap>div>a:not(.btn) { font-size:14px; padding-inline:4px!important; }
 body .top .btn { font-size:14px; }
}
/* Grid cards must shrink with their container, rather than widen the page. */
body :is(.panel,.metric,.quick) { min-width:0; max-width:100%; }
body .activityrow { grid-template-columns:32px minmax(0,1fr) auto; }
body .eventrow { grid-template-columns:45px minmax(0,1fr) auto; }
body :is(.activityrow,.eventrow)>div { min-width:0; overflow-wrap:anywhere; }
body .quick>span:last-child { min-width:0; overflow-wrap:anywhere; }
@media(max-width:680px) {
 body :is(.metrics,.grid,.quickgrid,.business-profile-grid,.membercards,.eventsview) { grid-template-columns:minmax(0,1fr); }
}

/* ===== Site-wide responsive polish (14 Oct 2026) =====
   Applies to every page: landing pages, member app, merchant dashboard, onboarding, checkout, policies. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body img,body video{max-width:100%}

/* Readable line length for prose on wide screens (about 70 characters). */
body main p:not([class*=eyebrow]):not([class*=pill]){max-width:72ch}

/* Tap targets: FAQ questions and small text links get a full 44px hit area. */
body details>summary{min-height:44px;box-sizing:border-box;cursor:pointer}
body :is(.privacy-back,.top .nav a.plain,.top .wrap>div>a:not(.btn)){display:inline-flex;align-items:center;min-height:44px}

/* Landing pages: "About us" in the header from tablet width up (phone headers are already full). */
.nav-about{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;font-weight:700;text-decoration:none;color:var(--choplah-green,#315e4a)}
.nav-about:hover{text-decoration:underline;text-underline-offset:4px}
@media(max-width:760px){.nav-about{display:none!important}}
/* Landing page footers: link row. */
.foot-links{display:flex;flex-wrap:wrap;gap:0 20px}
.foot-links a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--choplah-green,#315e4a);text-decoration:none}
.foot-links a:hover{text-decoration:underline;text-underline-offset:4px}

/* Small labels: brand guide caption minimum is 13px (eyebrows stay 12px uppercase). */
body :is(.top .tag,.entrance-pill){font-size:13px}

/* Phones */
@media(max-width:760px){
 /* 16px text fields so iPhone Safari does not zoom in when a field is tapped. */
 body :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),select,textarea){font-size:16px!important}
}
@media(max-width:480px){
 /* Main hero buttons span the full width, so they're easy to hit with a thumb. */
 body .hero-cta{flex-direction:column;align-items:stretch}
 body .hero-cta>.btn{width:100%}
 body .foot{flex-direction:column;align-items:flex-start;gap:8px}
}
/* Long descriptive paragraphs at the foot of the landing pages. */
body section.wrap>p{max-width:72ch}
/* Sliders (bill estimator, onboarding): a 44px tall hit area around the track. */
body input[type=range]{min-height:44px;cursor:pointer}
/* Remaining small links and controls. */
body :is(a.brand,a.wordmark){display:inline-flex;align-items:center;min-height:44px}
body .rail a{min-height:44px}
body #welcome-offer{min-height:44px}
body a[href="/dashboard?page=billing"]{display:inline-flex;align-items:center;min-height:44px}
body a[href*="method=password_setup"]{display:flex!important;align-items:center;min-height:40px;font-size:13px!important}
body #merchantSignOut{font-size:13px!important}
body .privacy-back{font-size:13px!important}
