.client-mobile-nav,.client-mobile-home,.client-mobile-progress,.client-mobile-controls,.client-mobile-calendar,.client-mobile-success-actions { display:none; }
@media(max-width:640px){
  body.client-area { font-size:16px; }
  body.client-area main { padding:18px 12px calc(112px + env(safe-area-inset-bottom,0px)); }
  body.client-area #view-portal { min-width:0; }
  body.client-area #view-portal [hidden] { display:none!important; }
  body.client-area #view-portal .page-head h1 { font-size:30px; line-height:1.15; }
  body.client-area #view-portal .page-head p { font-size:16px; line-height:1.5; }
  body.client-area #view-portal :is(button,a,input,textarea,select) { font-size:16px; }
  body.client-area #view-portal :is(button,.text-control,.portal-pill,.preference-chip,.secondary-button,.primary-button) { min-height:44px; }
  body.client-area #view-portal :is(input,textarea,select) { min-width:0; max-width:100%; }
  body.client-area #view-portal :is(p,label,.field-hint,.form-message,.portal-time-context,.portal-selection-note,.booking-account-copy span) { font-size:15px; line-height:1.5; }
  body.client-area #view-portal :is(small,.portal-step>p,.portal-summary-card>p,.portal-confirmation p,#clientAppointmentsRange) { font-size:14px; line-height:1.5; }
  body.client-area #view-portal :is(.portal-step h2,.portal-summary-card h2,.client-appointments h2) { font-size:24px; line-height:1.2; }
  body.client-area #view-portal :is(.portal-layout,.portal-side,.portal-step,.portal-service-grid,.portal-time-grid,.client-appointments,.portal-account-bar,.signed-account,.summary-line) { min-width:0; }
  body.client-area #view-portal :is(strong,span,p,h2,h3) { overflow-wrap:anywhere; }
  body.client-area #view-portal .portal-layout { display:block; }
  body.client-area #view-portal .portal-form-body { padding:18px 14px; gap:20px; }
  body.client-area #view-portal .portal-step { scroll-margin-top:16px; }
  body.client-area #view-portal .portal-service-grid { grid-template-columns:1fr; gap:12px; }
  body.client-area #view-portal .portal-choice { padding:16px 40px 16px 16px; text-align:left; }
  body.client-area #view-portal .portal-choice strong { font-size:18px; }
  body.client-area #view-portal .portal-choice span { font-size:15px; }
  body.client-area #view-portal .portal-pill { padding:12px 15px; }
  body.client-area #view-portal .portal-time-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
  body.client-area #view-portal .portal-time { min-height:64px; padding:10px 5px; }
  body.client-area #view-portal .portal-time strong { font-size:18px; }
  body.client-area #view-portal .portal-time span { font-size:13px; }
  body.client-area #view-portal .portal-side { position:static; margin-top:18px; }
  body.client-area #view-portal .integration-card,body.client-area #view-portal .booking-progress { display:none; }
  body.client-area #view-portal .portal-masthead { padding:16px; align-items:start; flex-wrap:wrap; }
  body.client-area #view-portal .portal-shop .brand-mark { display:grid; place-items:center; flex:0 0 42px; margin:0; color:var(--ink); font-size:22px; line-height:1; }
  body.client-area #view-portal .portal-masthead-actions { display:none; }
  body.client-area #view-portal .portal-summary-card { margin-bottom:20px; padding:16px; box-shadow:none; }
  body.client-area #view-portal .summary-line { gap:12px; font-size:15px; }
  body.client-area #view-portal .summary-line strong { text-align:right; }
  body.client-area #view-portal .preference-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  body.client-area #view-portal .preference-chip { display:flex; align-items:stretch; padding:0; min-width:0; }
  body.client-area #view-portal .preference-chip span { width:100%; min-height:48px; padding:10px; border-radius:12px; font-size:14px; line-height:1.4; }
  body.client-area #view-portal .summary-total span { font-size:14px; }
  body.client-area #view-portal .booking-account-copy :is(strong,span) { white-space:normal; overflow:visible; }
  body.client-area #view-portal .booking-account-copy strong { font-size:16px; }
  body.client-area #view-portal .signed-account .account-intro span { font-size:14px; white-space:normal; }
  body.client-area #view-portal .signed-account { flex-wrap:wrap; gap:12px; }
  body.client-area #view-portal .signed-account .account-intro { flex:1; min-width:140px; }
  body.client-area #view-portal .client-appointment :is(p,small,.status) { font-size:14px; line-height:1.5; }
  body.client-area #view-portal .client-appointment h3 { font-size:20px; }
  body.client-area #view-portal .client-appointment button { width:100%; }
  body.client-area #view-portal .client-mobile-home { display:grid; gap:16px; padding:24px 18px; }
  body.client-area #view-portal .client-mobile-home h2 { font:700 25px Georgia,serif; margin:0; }
  body.client-area #view-portal .client-mobile-home p { margin:0; color:var(--muted); }
  body.client-area #view-portal .client-mobile-progress { display:block; padding:16px; border-bottom:1px solid var(--line); }
  body.client-area #view-portal .client-mobile-track { height:5px; margin-top:10px; background:var(--surface-2); border-radius:5px; }
  body.client-area #view-portal .client-mobile-track span { display:block; height:100%; background:var(--accent-strong); border-radius:5px; }
  body.client-area #view-portal .client-mobile-controls { display:flex; justify-content:space-between; gap:12px; padding-top:4px; }
  body.client-area #view-portal .client-mobile-controls button { flex:1; padding:12px; }
  body.client-area #view-portal .client-mobile-calendar { display:block; padding:12px 8px; margin:16px 0; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
  body.client-area #view-portal .client-mobile-month { display:grid; grid-template-columns:44px minmax(0,1fr) 44px; align-items:center; gap:6px; }
  body.client-area #view-portal .client-mobile-month input { width:100%; padding:8px 3px; font-weight:700; text-align:center; border:0; background:transparent; }
  body.client-area #view-portal .client-mobile-month button { border:1px solid var(--line); border-radius:10px; background:var(--surface); }
  body.client-area #view-portal .client-mobile-week,.client-area #view-portal .client-mobile-days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:2px; }
  body.client-area #view-portal .client-mobile-week { margin-top:14px; text-align:center; font-size:12px; color:var(--muted); }
  body.client-area #view-portal .client-mobile-days { margin-top:6px; }
  body.client-area #view-portal .client-mobile-days button { min-height:44px; padding:8px 0; border:1px solid transparent; border-radius:8px; background:transparent; font-size:16px; }
  body.client-area #view-portal .client-mobile-days button:disabled { opacity:.3; text-decoration:line-through; }
  body.client-area #view-portal .client-mobile-days button[aria-pressed=true] { background:var(--ink); color:white; border-color:var(--ink); font-weight:800; }
  body.client-area #view-portal .client-mobile-shortcuts { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
  body.client-area #view-portal .client-mobile-shortcuts button { padding:10px 14px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
  body.client-area #view-portal .client-mobile-selected-date { padding:12px; background:var(--surface-2); border-radius:10px; font-weight:700; margin-bottom:12px; }
  body.client-area #view-portal .client-mobile-success-actions { display:block; margin-top:16px; }
  body.client-area .client-mobile-nav { position:fixed; z-index:45; bottom:0; left:0; right:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:3px; padding:8px 6px calc(8px + env(safe-area-inset-bottom,0px)); border-top:1px solid var(--line); background:var(--surface,#fffdf8); box-shadow:0 -4px 18px #171a1810; }
  body.client-area .client-mobile-nav button { min-height:62px; min-width:0; padding:6px 2px; border:0; border-radius:12px; color:var(--muted); background:transparent; font-family:inherit; font-weight:700; font-size:12px; line-height:1.25; }
  body.client-area .client-mobile-nav button span { display:block; font-size:22px; margin-bottom:5px; }
  body.client-area .client-mobile-nav button[aria-current=page] { color:var(--ink); background:var(--surface-2); }
  body.client-area .client-mobile-nav button[data-client-mobile-nav=booking][aria-current=page] { background:var(--accent); }
  body.client-area.client-mobile-keyboard .client-mobile-nav { display:none; }
  body.client-area #view-portal:not([data-mobile-page=home])>.page-head { display:none; }
  body.client-area #view-portal[data-mobile-success=true] #clientBookingForm { display:none; }
}
@media(max-width:340px){
  body.client-area #view-portal .client-mobile-month input { grid-column:1 / -1; grid-row:1; min-width:0; padding:8px 10px; }
  body.client-area #view-portal .client-mobile-month button:first-child { grid-column:1; grid-row:2; }
  body.client-area #view-portal .client-mobile-month button:last-child { grid-column:3; grid-row:2; }
}