.pwa-panel{text-align:left;padding:6px 0;color:#352b25}.pwa-panel-heading{display:flex;align-items:center;gap:13px;margin:0 0 20px}.pwa-panel-heading>img{width:52px;height:52px;border-radius:15px}.pwa-panel h2{font-size:23px;line-height:1.5;margin:0}.pwa-panel-heading p{font-size:14px;color:#887261;margin:3px 0}.pwa-panel h3{font-size:17px;line-height:1.6;margin:0 0 5px}.pwa-install-step,.pwa-permission{display:flex;gap:13px;border:1px solid #e9ddd2;border-radius:17px;padding:16px;margin-bottom:12px;background:#fffaf6}.pwa-install-step>div,.pwa-permission>div{min-width:0;flex:1}.pwa-step-icon{width:35px;height:35px;display:grid;place-items:center;flex:0 0 35px;background:#f9e8da;border-radius:11px;color:#a7441e}.pwa-icon{height:21px;width:21px;flex-shrink:0;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}.pwa-panel p{font-size:13px;line-height:1.8;margin:4px 0 10px;color:#8d7764;overflow-wrap:anywhere}.pwa-panel ol{font-size:14px;line-height:1.9;padding-left:20px;margin:9px 0}.pwa-panel ol .pwa-icon{width:17px;height:17px}.pwa-panel .button{display:inline-flex;gap:7px;align-items:center;justify-content:center;min-height:46px;font-size:14px;margin:7px 0 0;padding:10px 13px}.pwa-permissions-title{margin:20px 0 12px!important}.pwa-panel .pwa-note{font-size:11px;text-align:center;margin:12px 12px 0;line-height:1.8}.pwa-panel .text-button{font-size:13px;min-height:44px;display:block}.pwa-panel [data-pwa-notify-state],.pwa-panel [data-pwa-location-state]{font-size:12px;margin-top:10px}.pwa-panel [hidden]{display:none!important}.pwa-offline{margin:0;min-height:100dvh;display:grid;place-items:center;background:#f8f5f1;color:#352b25;font-family:system-ui,sans-serif;padding:24px;box-sizing:border-box}.pwa-offline main{max-width:400px;background:#fff;border:1px solid #e9ddd2;border-radius:24px;padding:30px;text-align:center}.pwa-offline img{width:130px;display:block;margin:0 auto 32px}.pwa-offline svg{height:60px;width:60px;stroke:#b0784b;stroke-width:1.5;fill:none;stroke-linecap:round}.pwa-offline h1{font-size:25px}.pwa-offline p{font-size:15px;line-height:1.8;color:#897260}.pwa-offline a{display:block;border-radius:12px;background:#a7441e;color:white;text-decoration:none;padding:14px;margin-top:25px}.customer-menu-list{display:grid;gap:11px;padding:8px 0}.customer-menu-list h2{text-align:left;margin:0 0 12px}.customer-menu-list>a,.customer-menu-list>button{display:flex;align-items:center;gap:13px;width:100%;min-height:60px;border:1px solid #e6d8cd;border-radius:14px;background:#fffaf6;color:#513c2d;text-decoration:none;padding:14px;font:inherit;font-size:16px;text-align:left;box-sizing:border-box}.customer-menu-list .pwa-icon{width:25px;height:25px;color:#a7441e}.customer-menu-list [hidden]{display:none!important}.customer-header-actions{display:flex;gap:8px;align-items:center}.customer-menu-button{display:inline-grid;place-items:center;width:44px;height:44px;min-height:44px;border:1px solid #e6d8cd;border-radius:12px;background:#fff8f3;color:#a7441e;padding:0;font:inherit;cursor:pointer}.customer-menu-button .pwa-icon{width:23px;height:23px}.ca-header>.customer-menu-button{margin-left:auto}.ca-header>[data-ca-logout]{margin-left:0}@media(max-width:350px){.pwa-panel-heading>img{width:43px;height:43px}.pwa-panel h2{font-size:20px}.pwa-install-step,.pwa-permission{padding:12px;gap:9px}.pwa-step-icon{width:29px;flex-basis:29px;height:29px}.pwa-panel .button{font-size:13px}.pwa-panel ol{font-size:13px}}
/* One optional, dismissible customer banner. Dismissal stores only install/setup flags. */
.customer-pwa-banner{display:grid;grid-template-columns:30px minmax(0,1fr) auto 44px;align-items:center;gap:9px;min-height:60px;box-sizing:border-box;padding:8px max(12px,env(safe-area-inset-right,0px)) 8px max(12px,env(safe-area-inset-left,0px));margin:0;background:#fff0e4;border-bottom:1px solid #edcfb5;color:#603b25;font-family:inherit}.customer-pwa-banner[hidden]{display:none!important}.pwa-banner-symbol{display:grid;place-items:center;width:30px;height:34px;color:#a7441e}.pwa-banner-copy{display:flex;flex-direction:column;min-width:0;gap:1px}.pwa-banner-copy strong{font-size:14px;line-height:1.45;color:#673d24}.pwa-banner-copy span{font-size:12px;line-height:1.55;color:#8a6044;overflow-wrap:anywhere}.pwa-banner-action,.pwa-banner-close{display:grid;place-items:center;border:0;font:inherit;cursor:pointer;min-height:44px;box-sizing:border-box}.pwa-banner-action{font-size:13px;font-weight:650;line-height:1.5;border-radius:10px;background:#a7441e;color:#fff;padding:9px 13px;white-space:nowrap}.pwa-banner-close{background:transparent;color:#8c6247;width:44px;padding:6px}.pwa-banner-close .pwa-icon{width:20px;height:20px}.customer-pwa-banner button:focus-visible,.customer-menu-list button:focus-visible{outline:3px solid #d3a77c;outline-offset:2px}.customer-menu-list .customer-menu-logout{border-color:#efd7c7;background:#fff7f1;color:#a7441e}.customer-menu-list .customer-menu-status{font-size:12px;line-height:1.8;color:#8a6d58;text-align:left;margin:0 3px}.customer-menu-list .customer-menu-status:empty{display:none}.customer-nav-enabled #customer-view #customer-help{display:none!important}@media(min-width:700px){.customer-pwa-banner{grid-template-columns:30px minmax(0,1fr) auto 44px;padding-inline:max(22px,calc((100vw - 1040px)/2));gap:13px}.pwa-banner-copy{flex-direction:row;align-items:baseline;gap:12px}.pwa-banner-copy span{font-size:12px}}@media(max-width:350px){.customer-pwa-banner{grid-template-columns:23px minmax(0,1fr) auto 44px;gap:6px;padding-inline:9px}.pwa-banner-symbol{width:23px}.pwa-banner-copy strong{font-size:13px}.pwa-banner-copy span{font-size:11px}.pwa-banner-action{font-size:12px;padding-inline:10px}.pwa-banner-close{width:44px}}@media(max-width:600px) and (max-height:900px){#customer-view.pwa-banner-visible .prepaid-shell{margin-top:8px;min-height:0}#customer-view.pwa-banner-visible .customer-shell{padding-top:14px;padding-bottom:14px}#customer-view.pwa-banner-visible .member-journey{margin-top:14px;padding-top:12px}#customer-view.pwa-banner-visible .member-option{margin-block:8px}.pwa-banner-visible .ca-shell{padding-top:9px}.pwa-banner-visible .ca-page-title{margin-top:0;margin-bottom:8px}.pwa-banner-visible .ca-live-main{margin-block:8px}}

@media(max-width:700px){#customer-view.pwa-banner-visible .prepaid-shell{min-height:0}.customer-pwa-banner{flex-shrink:0}}
/* Keep one deliberate sign-out action in the customer menu after bootstrap. */
.customer-nav-enabled #member-signout,.customer-nav-enabled #wallet-history-signout,.customer-nav-enabled [data-ca-logout]{display:none!important}
/* Preserve a single primary auth screen with the optional banner. Expanded
   station details, large text and the keyboard can still grow naturally. */
@media(max-width:700px) and (max-height:900px){
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"]){position:relative;padding-top:12px;padding-bottom:14px;margin-top:7px}
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"]) .station-summary .eyebrow{display:none}
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"]) .station-symbol{width:36px;height:36px;border-radius:11px}
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"]) .station-symbol>.ui-icon{width:23px;height:23px}
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"]) .station-summary h1{font-size:18px;line-height:1.45;margin:0;padding-right:40px}
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"]) .station-facts{margin:8px 0 2px}
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"]) #customer-details:not([open]){position:absolute;top:8px;right:9px;width:44px;height:44px;min-height:44px;margin:0;padding:0;border:0}
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"]) #customer-details:not([open])>summary{display:flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;font-size:0;gap:0;padding:0}
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"]) #customer-details:not([open]) .station-details-chevron{display:none}
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"]) #customer-notice:not([open]){margin-top:6px;padding:0 9px}
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"]) #customer-notice>summary{min-height:44px}
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"])>.charge-pane{margin-top:10px;padding-bottom:10px}
 #customer-view.pwa-banner-visible #membership-choice h2{font-size:18px;line-height:1.45;margin:0 0 3px}
 #customer-view.pwa-banner-visible #membership-choice .pane-copy{font-size:12px;line-height:1.55;margin:3px 0 8px}
 #customer-view.pwa-banner-visible #membership-choice .member-option{min-height:64px;padding:10px 12px;margin:8px 0}
 #customer-view.pwa-banner-visible #membership-choice .member-option b{font-size:15px;line-height:1.5}
 #customer-view.pwa-banner-visible #membership-choice .member-option small{font-size:12px;line-height:1.5;margin-top:1px}
 #customer-view.pwa-banner-visible .prepaid-shell:is([data-view="membership-choice"],[data-view="customer-auth"],[data-view="registration-details"])>.member-journey{margin-top:auto;padding-top:10px;padding-bottom:4px}
 #customer-view.pwa-banner-visible #customer-auth .customer-step{margin-top:5px;margin-bottom:7px}
 #customer-view.pwa-banner-visible #customer-auth .phone-fields{margin-top:10px;margin-bottom:13px}
}
/* Standalone iOS can draw under the status bar with viewport-fit=cover.
   Each customer root owns its inset once; banner/header add no second top inset.
   Variables also permit deterministic browser QA of nonzero device insets. */
body.customer-pwa-standalone{--pwa-safe-top:env(safe-area-inset-top,0px);--pwa-safe-right:env(safe-area-inset-right,0px);--pwa-safe-bottom:env(safe-area-inset-bottom,0px);--pwa-safe-left:env(safe-area-inset-left,0px)}
.customer-pwa-standalone .swal2-container{--customer-modal-top:max(12px,var(--pwa-safe-top,0px));--customer-modal-bottom:max(12px,var(--pwa-safe-bottom,0px));padding-top:var(--customer-modal-top);padding-bottom:var(--customer-modal-bottom);padding-left:max(10px,var(--pwa-safe-left,0px));padding-right:max(10px,var(--pwa-safe-right,0px))}
.customer-pwa-standalone .kkm-panel{max-height:calc(100dvh - var(--customer-modal-top,12px) - var(--customer-modal-bottom,12px))}
.customer-pwa-standalone .kkm-panel>.swal2-html-container{max-height:calc(100dvh - var(--customer-modal-top,12px) - var(--customer-modal-bottom,12px) - 56px)}
.customer-pwa-standalone :is(#customer-view,#customer-activity-view,#station-finder-view){box-sizing:border-box;padding-top:var(--pwa-safe-top,0px)}
.customer-pwa-standalone .customer-pwa-banner{padding-left:max(12px,var(--pwa-safe-left,0px));padding-right:max(12px,var(--pwa-safe-right,0px))}
.customer-pwa-standalone #customer-view>header{padding-left:max(16px,var(--pwa-safe-left,0px));padding-right:max(16px,var(--pwa-safe-right,0px))}
.customer-pwa-standalone :is(#customer-activity-view,#station-finder-view)>header{padding-left:max(15px,var(--pwa-safe-left,0px));padding-right:max(15px,var(--pwa-safe-right,0px))}
@media(max-width:700px){
 .customer-pwa-standalone #customer-view .prepaid-shell{min-height:calc(100svh - var(--customer-header) - var(--screen-gap) - max(8px,var(--pwa-safe-bottom,0px)) - var(--pwa-safe-top,0px));min-height:calc(100dvh - var(--customer-header) - var(--screen-gap) - max(8px,var(--pwa-safe-bottom,0px)) - var(--pwa-safe-top,0px))}
 .customer-pwa-standalone #customer-view.pwa-banner-visible .prepaid-shell{min-height:0}
}
@media(min-width:700px){
 .customer-pwa-standalone .customer-pwa-banner{padding-left:max(22px,var(--pwa-safe-left,0px),calc((100vw - 1040px)/2));padding-right:max(22px,var(--pwa-safe-right,0px),calc((100vw - 1040px)/2))}
 .customer-pwa-standalone #customer-view>header{padding-left:max(24px,var(--pwa-safe-left,0px));padding-right:max(24px,var(--pwa-safe-right,0px))}
}