/* Phone layouts are kept together so desktop styling stays intact. */
.mobile-brand,.sidebar-close,.menu-backdrop{display:none}
@media(max-width:760px){
 html{scroll-padding-top:84px}
 body{min-width:0}
 body.menu-open{overflow:hidden}
 .app-shell,main,main>*,.heading-row>div,.card-top>div,.ref-title>div,.profile-head>div,.photo-editor>div,.early-hero>div,.offer-author>div{min-width:0}
 main{padding:24px max(16px,env(safe-area-inset-right)) 28px max(16px,env(safe-area-inset-left));width:100%}
 h1,.heading-row h1{font-size:clamp(25px,6.8vw,30px);line-height:1.25;letter-spacing:-.8px;overflow-wrap:anywhere}
 .subheading{font-size:14px;line-height:1.75}
 .topbar{position:sticky;top:0;z-index:20;height:auto;min-height:68px;padding:calc(10px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 10px max(16px,env(safe-area-inset-left));gap:12px;box-shadow:0 3px 12px #11223c06}
 .topbar .breadcrumb{display:none}
 .mobile-brand{display:flex;align-items:center;gap:8px;flex:1;font-family:Manrope,Arial,sans-serif;font-size:22px;font-weight:800;letter-spacing:-.8px;color:var(--navy);min-height:44px}
 .mobile-brand img{flex-shrink:0}
 .icon-button,.card-top .icon-button{width:44px;height:44px;min-width:44px;min-height:44px;flex-shrink:0}
 .button,.text-button,.section-tab{min-height:44px;white-space:normal;line-height:1.5}
 .button{font-size:14px;padding:12px 16px;text-align:center}
 .text-button{padding:10px 4px}
 .heading-row>.button{width:100%;font-size:14px;white-space:normal}
 .sidebar{width:min(310px,calc(100vw - 44px));height:100dvh;overflow-y:auto;overscroll-behavior:contain;z-index:40;padding:calc(24px + env(safe-area-inset-top)) 18px calc(20px + env(safe-area-inset-bottom));box-shadow:none}
 .sidebar.open{box-shadow:12px 0 45px #11223c33}
 .sidebar .brand{font-size:27px;margin-left:0;gap:8px}
 .sidebar .brand-mark{width:32px;height:32px}
 .sidebar-close{display:grid;position:absolute;right:10px;top:calc(18px + env(safe-area-inset-top));background:transparent;border-color:#344963;color:#d1e4e7}
 .sidebar .brand-caption{margin:12px 0 24px;font-size:10px}
 .sidebar .nav-caption{margin:24px 10px 12px}
 .sidebar nav{gap:5px}
 .sidebar .nav-link{min-height:48px;font-size:14px}
 .sidebar-bottom{padding-top:24px}
 .sidebar .account{min-height:60px}
 .menu-backdrop:not([hidden]){display:block;position:fixed;inset:0;z-index:35;border:0;background:#11223c88;backdrop-filter:blur(2px);padding:0;touch-action:none}
 .field input,.field select,.field textarea,.search-box input,.sort-select,.offer-filters select,.early-form select{font-size:16px;min-height:48px;max-width:100%}
 .field>label{font-size:14px;line-height:1.6}
 .field textarea{min-height:120px}
 .two-fields,.filter-fields{grid-template-columns:minmax(0,1fr);gap:0}
 .filter-panel .field{margin-bottom:16px}
 .filter-panel .field:last-child{margin-bottom:0}
 .search-box{min-width:0}
 .search-row{flex-direction:column;gap:10px}
 .search-row .search-box,.sort-select{width:100%;max-width:none}
 .search-box input{height:48px;padding-right:12px}
 .cards,.offer-list,.plans-grid{grid-template-columns:minmax(0,1fr)}
 .professional-card,.offer-card,.plan-card,.panel{padding:20px}
 .card-top{align-items:flex-start;gap:10px}
 .card-top .avatar{width:46px;height:46px;flex-shrink:0}
 .card-top h3{font-size:16px;overflow-wrap:anywhere}
 .card-actions,.offer-actions,.profile-actions,.form-actions{flex-direction:column;gap:10px}
 .card-actions .button,.offer-actions .button,.profile-actions .button,.form-actions .button{width:100%;min-width:0;flex:auto;min-height:48px;font-size:14px}
 .card-meta{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
 .card-meta strong,.profile-facts strong,.offer-location{overflow-wrap:anywhere}
 .bio,.offer-description{font-size:14px}
 .result-summary{gap:10px;flex-wrap:wrap;line-height:1.6}
 .section-tabs{gap:8px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .section-tab{padding:12px 8px;font-size:14px}
 .stat-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .stat-card{min-width:0;padding:16px}
 .stat-card span{font-size:12px;line-height:1.6;display:block;overflow-wrap:anywhere}
 .stat-card:last-child{grid-column:1/-1}
 .referral-card{grid-template-columns:minmax(0,1fr);padding:18px;gap:16px}
 .referral-card .ref-title{align-items:flex-start}
 .ref-title p,.referral-facts{overflow-wrap:anywhere}
 .ref-side{display:flex;flex-direction:column;align-items:flex-start;gap:12px;border-top:1px solid var(--border);padding-top:16px}
 .ref-side>div{width:100%;display:flex;flex-direction:column;gap:8px}
 .ref-side .button,.ref-side .text-button{font-size:14px;min-height:44px;margin:0;text-align:center;width:100%}
 .ref-side .status{font-size:12px}
 .profile-head{align-items:flex-start}
 .profile-head h2{overflow-wrap:anywhere}
 .upload-zone{padding:18px;align-items:flex-start}
 .upload-zone>div{min-width:0;flex:1}
 .upload-zone strong{overflow-wrap:anywhere}
 .upload-zone .button{width:100%;margin:0}
 .photo-editor{padding:18px}
 .photo-actions .button{min-height:48px}
 dialog{width:calc(100% - 16px);max-width:700px;max-height:calc(100dvh - 16px);margin:auto;border-radius:16px;overscroll-behavior:contain}
 .modal-head{padding:20px 18px;gap:12px;position:sticky;top:0;background:#fff;z-index:2}
 .modal-head>div{min-width:0}
 .modal-head h2{font-size:20px;line-height:1.4;overflow-wrap:anywhere}
 .modal-head .icon-button{align-self:flex-start}
 .modal-body{padding:20px 18px}
 .modal-footer{padding:16px 18px calc(16px + env(safe-area-inset-bottom));flex-direction:column-reverse;gap:10px}
 .modal-footer .button{width:100%;min-height:48px}
 .profile-hero{gap:12px}
 .profile-hero>div{min-width:0}
 .profile-hero .avatar{width:58px;height:58px;flex-shrink:0}
 .profile-facts{grid-template-columns:repeat(2,minmax(0,1fr));padding:16px}
 .contact-unlocked{padding:18px}
 .early-hero{padding:24px 20px;gap:24px}
 .early-hero h2{font-size:26px}
 .early-actions{gap:12px;flex-direction:column;align-items:stretch}
 .early-actions .button,.early-actions .text-button{width:100%;text-align:center;justify-content:center}
 .early-steps>div{gap:12px}
 .early-form .two-fields{grid-template-columns:minmax(0,1fr);gap:0}
 .early-consent{font-size:13px;line-height:1.75}
 .early-consent input{width:20px;height:20px;flex-shrink:0}
 .early-privacy{font-size:13px}
 .early-privacy summary{padding:10px 0;min-height:44px}
 .early-receipt{align-items:flex-start}
 #toast{bottom:calc(16px + env(safe-area-inset-bottom));left:50%;width:calc(100% - 32px);max-width:440px;line-height:1.6;padding:14px 18px}
 footer{padding:12px 16px calc(24px + env(safe-area-inset-bottom));line-height:1.8}
}
@media(max-width:420px){.topbar .demo-badge{display:none}.profile-facts{grid-template-columns:minmax(0,1fr)}.profile-facts>div:last-child{grid-column:auto}}
@media(max-width:350px){.sidebar .brand{font-size:24px}.sidebar .brand-mark{width:28px;height:28px}.sidebar-close{right:6px}.stat-row{grid-template-columns:minmax(0,1fr)}.stat-card:last-child{grid-column:auto}}
