/* Prevent Android text inflation; keep browser zoom available. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
/* Fieldsets otherwise retain their browser-default min-content width. */
.app-form fieldset, .app-category-picker { min-inline-size: 0; max-inline-size: 100%; inline-size: 100%; }
.app-form legend { max-inline-size: 100%; white-space: normal; }
.app-form :is(label, fieldset, .field-grid, .specialty-picker) > * { min-inline-size: 0; }
/* Compact mobile account flows with a full-width reading column. */
@media (max-width: 760px) {
  .app-main { padding: 22px 16px 32px; }
  .app-stage, .app-main, .order-wizard, .wizard-workspace, .wizard-card, .auth-card { min-width: 0; }
  .app-eyebrow { font-size: 11px; letter-spacing: .09em; line-height: 1.6; }
  .app-wizard-steps { margin-bottom: 24px; }
  .app-wizard-steps button { min-width: 0; gap: 8px; }
  .app-wizard-steps strong { font-size: 12px; }
  .wizard-card { padding: 22px 16px; gap: 20px; border-radius: 20px; }
  .section-heading h2 { font-size: 25px; line-height: 1.25; }
  .section-heading p { font-size: 15px; line-height: 1.6; }
  .app-category-picker { min-width: 0; padding: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .app-category-picker button { min-width: 0; padding: 12px 8px; }
  .app-category-picker button span { overflow-wrap: normal; word-break: normal; line-height: 1.4; }
  .app-form .field-grid { grid-template-columns: minmax(0, 1fr); }
  .app-form label { min-width: 0; }
  .app-form :is(input, select, textarea) { max-width: 100%; }
  .wizard-form-actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .wizard-form-actions .app-btn { width: 100%; min-width: 0; margin: 0; min-height: 48px; justify-content: center; line-height: 1.4; white-space: normal; }
  .wizard-form-actions .save-draft { width: 100%; margin: 0; order: 3; }
  .auth-page { padding: 14px 14px 28px; }
  .auth-home { margin-bottom: 14px; }
  .auth-layout { width: 100%; max-width: 520px; }
  .auth-benefits { display: none; }
  .auth-card { padding: 26px 22px; }
  .auth-card h2 { font-size: 28px; }
  .auth-lead { font-size: 15px; line-height: 1.6; }
  .auth-step { font-size: 11px; gap: 10px; }
  .auth-step span:last-child { flex-shrink: 0; }
  .account-type { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .account-type button { min-width: 0; flex-wrap: wrap; align-content: start; }
  .account-type button > span { min-width: 0; width: 100%; }
  .auth-form .specialty-picker { grid-template-columns: minmax(0, 1fr); }
  .auth-form .app-btn { white-space: normal; line-height: 1.4; }
}
@media (max-width: 360px) {
  .auth-card { padding: 24px 18px; }
}

/* Phone shell: explicitly sized tracks prevent intrinsic form content widening the page. */
@media (max-width: 760px) {
  .mg-app, .app-stage, .app-main, .auth-page { inline-size: 100%; max-inline-size: 100%; min-inline-size: 0; }
  .auth-layout { display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; min-inline-size: 0; max-inline-size: 520px; }
  .auth-layout > *, .wizard-workspace > *, .wizard-card > *, .auth-card > *, .field-grid > * { min-inline-size: 0; max-inline-size: 100%; }
  .wizard-workspace { inline-size: 100%; grid-template-columns: minmax(0, 1fr); }
  .app-wizard-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); inline-size: 100%; max-inline-size: 100%; gap: 8px; }
  .app-wizard-steps button { display: flex; flex-direction: column; align-items: center; justify-content: start; inline-size: 100%; min-inline-size: 0; gap: 10px; text-align: center; }
  .app-wizard-steps button:after { display: none; }
  .app-wizard-steps button > span { inline-size: 32px; block-size: 32px; flex: 0 0 32px; font-size: 13px; }
  .app-wizard-steps strong { max-inline-size: 100%; font-size: 12px; line-height: 1.4; white-space: normal; }
  .app-form :is(input:not([type=checkbox]), select, textarea) { min-inline-size: 0; inline-size: 100%; max-inline-size: 100%; font-size: 16px; }
  .app-form .check-field > span, .specialty-picker label > span { min-inline-size: 0; overflow-wrap: anywhere; }
  .app-form .check-field input, .specialty-picker input[type=checkbox] { flex-shrink: 0; }
  .app-topbar { max-inline-size: 100%; min-inline-size: 0; }
  .app-topbar-leading { flex: 1 1 auto; min-inline-size: 0; }
  .app-topbar-leading strong { min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .app-topbar-actions { flex: 0 0 auto; }
}
@media (max-width: 360px) {
  .app-wizard-steps { gap: 4px; }
  .app-wizard-steps strong { font-size: 11px; }
}

/* Role-aware account dock, hidden outside the phone layout. */
.app-bottom-nav{display:none}
@media(max-width:760px){
 .app-topbar {
  -webkit-backdrop-filter: blur(24px) saturate(150%);
  backdrop-filter: blur(24px) saturate(150%);
 }
 .app-topbar{background:rgba(255,255,255,.7);border-bottom:1px solid rgba(255,255,255,.8);box-shadow:0 1px 0 #dce6f070,0 8px 30px #18365805}
 .mg-app{--account-dock-space:calc(92px + env(safe-area-inset-bottom,0px));padding-bottom:var(--account-dock-space)}
 .app-bottom-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;position:fixed;z-index:35;left:max(10px,env(safe-area-inset-left,0px));right:max(10px,env(safe-area-inset-right,0px));bottom:max(10px,env(safe-area-inset-bottom,0px));max-width:540px;margin:0 auto;padding:7px 6px;border:1px solid #ffffffd9;border-radius:24px;box-shadow:0 12px 44px #1836581c,0 0 0 1px #dbe5f280,inset 0 1px 0 #fff}
 .app-bottom-nav {
  background: linear-gradient(180deg, rgba(255, 255, 255, .24), rgba(225, 237, 252, .40));
  /* Keep the prefixed declaration first so the CSS minifier retains both. */
  -webkit-backdrop-filter: blur(16px) saturate(155%);
  backdrop-filter: blur(16px) saturate(155%);
 }
 .app-bottom-destination{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:58px;padding:5px 2px;border:0;border-radius:17px;background:transparent;color:#52647b;font:600 10px/1.3 var(--font);transition:background .18s,color .18s,transform .18s;touch-action:manipulation}
 .app-bottom-symbol{position:relative;display:flex;align-items:center;justify-content:center;width:34px;height:30px;border-radius:11px;transition:background .18s,box-shadow .18s}
 .app-bottom-label{max-width:100%;white-space:nowrap;font-size:10px;letter-spacing:-.015em}
 .app-bottom-destination.is-active{background:rgba(216,232,255,.58);color:#0753e8;font-weight:800}
 .app-bottom-destination.is-active:after{content:'';position:absolute;bottom:3px;width:13px;height:2px;border-radius:2px;background:currentColor}
 .app-bottom-destination.is-create .app-bottom-symbol{background:linear-gradient(145deg,#2267ff,#0753e8);color:#fff;box-shadow:0 4px 10px #0753e82b}

 .app-bottom-destination:active{transform:scale(.96);background:#dceaff}
 .app-bottom-destination:focus-visible{outline:2px solid #0753e8;outline-offset:1px;box-shadow:0 0 0 3px #fff}
 .app-bottom-count{position:absolute;top:-4px;right:-9px;min-width:16px;height:16px;display:grid;place-items:center;padding:0 4px;border:2px solid #fff;border-radius:12px;background:#0753e8;color:white;font-size:9px;line-height:1;font-weight:800;box-shadow:0 2px 5px #0753e81a}
 .app-toast{bottom:calc(var(--account-dock-space) + 6px)}
 .app-main{scroll-padding-bottom:var(--account-dock-space)}
 .mg-app :is(input,select,textarea,button,a){scroll-margin-bottom:var(--account-dock-space)}
 .app-topbar-actions>.app-btn.primary.compact{display:none}
}
@media(hover:hover) and (max-width:760px){.app-bottom-destination:hover{background:#f0f5fd;color:#0753e8}.app-bottom-destination.is-active:hover{background:#dfecff}.app-bottom-destination:hover .app-bottom-symbol{transform:translateY(-1px)}}
@media(prefers-reduced-motion:reduce){.app-bottom-destination,.app-bottom-symbol{transition:none}.app-bottom-destination:active,.app-bottom-destination:hover .app-bottom-symbol{transform:none}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.app-topbar{background:#fffffffa}.app-bottom-nav{background:#edf4fc}}

/* Mobile illustration composition: full-width headings and generously sized artwork. */
@media(max-width:760px){
 .wizard-page-heading{display:grid;grid-template-columns:minmax(0,1fr) clamp(128px,36vw,160px);grid-template-rows:auto auto auto;align-items:center;gap:12px 16px;inline-size:100%;max-inline-size:100%;min-height:0;padding:0;margin:18px 0 28px}
 .wizard-page-heading>div{display:contents}
 .wizard-page-heading .app-eyebrow{grid-column:1/-1;grid-row:1;margin:0}
 .wizard-page-heading h1{grid-column:1/-1;grid-row:2;max-width:100%;font-size:clamp(27px,7vw,32px);line-height:1.18;margin:0 0 2px}
 .wizard-page-heading p{grid-column:1;grid-row:3;min-width:0;max-width:100%;margin:0;padding:8px 0;font-size:15px;line-height:1.65;align-self:center}
 .wizard-page-heading img{grid-column:2;grid-row:3;position:static;justify-self:end;align-self:center;inline-size:100%;max-inline-size:160px;min-inline-size:0;width:100%;height:auto;block-size:164px;margin:0;object-fit:contain;object-position:center}
}
@media(max-width:360px){
 .wizard-page-heading{grid-template-columns:minmax(0,1fr) 128px;gap:12px}
 .wizard-page-heading p{font-size:14px;line-height:1.6}
 .wizard-page-heading img{block-size:142px}
}

/* Mobile character is grounded on the section divider; no cropped edge floats in the form. */
@media(max-width:760px){
 .auth-story{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(5,auto);gap:0;position:relative;z-index:1;align-items:start;min-height:0;min-inline-size:0;inline-size:100%;max-inline-size:100%;padding:26px 24px 0;overflow:visible}
 .auth-logo{grid-column:1;grid-row:1;display:block;width:80px;max-width:100%;margin:0 0 22px;padding:0}
 .auth-logo img{width:100%;height:54px;object-fit:contain}
 .auth-story>.app-eyebrow{grid-column:1;grid-row:2;max-width:100%;min-width:0;font-size:11px;letter-spacing:.08em;line-height:1.6;margin:0 0 12px}
 .auth-story h1{grid-column:1;grid-row:3;max-width:100%;margin:0;font-size:clamp(28px,7vw,33px);line-height:1.18}
 .auth-story>p{grid-column:1;grid-row:4;max-width:100%;margin:18px 0 0;font-size:15px;line-height:1.7}
 .auth-character{grid-column:1;grid-row:5;position:relative;inset:auto;z-index:2;align-self:end;justify-self:end;inline-size:clamp(180px,52vw,212px);max-inline-size:100%;min-inline-size:0;width:auto;height:auto;block-size:clamp(172px,50vw,204px);margin:20px 0 0;object-fit:contain;object-position:center bottom;filter:none;pointer-events:none}
 /* Compensate for transparent pixels in the source assets, so visible edges meet the divider. */
 .auth-character[src$="character-partner-2026.webp"]{transform:translateY(1.96%)}
 .auth-character[src$="character-plans-2026.webp"]{transform:translateY(.65%)}
 .auth-story+.auth-card{position:relative;z-index:0;padding-top:30px}
}
@media(max-width:360px){
 .auth-story{padding:22px 20px 0}
 .auth-story h1{font-size:27px}
 .auth-story>.app-eyebrow{font-size:10px;letter-spacing:.06em}
 .auth-character{block-size:172px;inline-size:180px;margin-top:18px}
}
