/* Keep phone controls readable without iOS field-focus zoom; preserve pinch zoom. */
.phone-award{display:none}
@media(max-width:700px){
 html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
 body{font-size:14px;line-height:1.5}
 main{width:100%;max-width:100%;margin-left:0;padding:16px 12px}
 #app,.card,.bid-channel,.table-wrap,.row,.columns{min-width:0;max-width:100%}
 h1,main>header h1{font-size:24px!important;overflow-wrap:anywhere}
 .workspace-intro h2,.job-guide h2,.installer-job-detail .job-guide h2,body[data-role=installer] .workspace-intro h2{font-size:25px!important}
 .installer-focus-pane .simple-job h3,.dispatch-lane .simple-job h3{font-size:24px}
 .card,.bid-channel{padding:16px}
 input,select,textarea,dialog input,dialog select,dialog textarea{font-size:16px!important}
 button,.button{min-height:44px;white-space:normal;overflow-wrap:anywhere;touch-action:manipulation}
 p,h2,h3,.pill,#identity{overflow-wrap:anywhere}.pill{white-space:normal}
 .brand-unit{min-width:0}.brand-name{font-size:16px!important;overflow-wrap:anywhere}
 .nav-inner{padding:10px 12px!important;gap:8px!important}.portal-home{padding:8px 10px}
 dialog{width:calc(100vw - 20px);max-width:540px;max-height:85dvh;padding:18px;overflow-y:auto}
 .bid-channels{grid-template-columns:minmax(0,1fr)}
 .bid-compare,.bid-compare tbody,.bid-compare tr,.bid-compare td{display:block;width:100%;min-width:0}
 .bid-compare thead{display:none}
 .bid-compare tr{border:1px solid var(--line);border-radius:8px;margin-bottom:14px;padding:8px}
 .bid-compare td{padding:7px 5px;white-space:normal;overflow-wrap:anywhere}
 .bid-compare td:before{content:attr(data-label);display:block;font-size:11px;font-weight:700;color:var(--muted)}
 .bid-compare td button,.phone-award{display:block;width:100%}
 .bid-channel .row{align-items:stretch}.bid-channel .row>button{flex:1 1 100%}
 #liveUpdates{position:fixed;left:10px;right:10px;bottom:12px;z-index:45;margin:0;padding:10px;background:#fff;border:1px solid #ccd8df;border-radius:8px;box-shadow:0 4px 24px #14273122;font-size:12px;display:flex;align-items:center;gap:8px}
 #liveUpdates span{flex:1;min-width:0}#liveUpdates button{flex-shrink:0;padding:8px}
 .setup-actions{display:flex;flex-direction:column;gap:10px}.setup-actions .button{width:100%;text-align:center}
}
/* Shared responsive surface for narrow iPhones, Android phones and small tablets. */
@media(max-width:820px){
 html{scroll-padding-top:80px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
 body{font-size:14px;line-height:1.5}
 main,.signed-out main{width:100%;max-width:100%;margin-left:0;padding:16px 12px 28px}
 .nav-inner{min-width:0;max-width:100%;padding:8px 12px!important;gap:8px!important;flex-wrap:nowrap}
 .brand-unit{flex:1 1 auto;min-width:0}.brand-unit .brand{min-width:0;gap:8px;height:auto;align-items:center}
 .brand-unit .brand-name{font-size:15px!important;line-height:1.1;white-space:normal;min-width:0;max-width:150px;margin:0}
 .logo-mark{flex:0 0 30px;width:30px;height:34px;font-size:11px}.brand-unit .workspace-label{display:none!important}
 .portal-home{flex:0 0 auto;margin-left:auto;min-height:44px;font-size:12px;padding:8px 10px}
 .portal-menu{flex:0 0 auto;margin-left:0}.portal-menu>summary{min-height:44px;font-size:12px;padding:10px}
 .portal-menu nav{width:min(290px,calc(100vw - 24px))!important;max-width:calc(100vw - 24px);max-height:calc(100dvh - 90px);overflow-y:auto}
 main>header,body[data-role=admin] main>header{display:flex;flex-direction:column;align-items:stretch;gap:6px;min-height:0;margin:0 0 12px}
 main>header h1,body[data-role=admin] main>header h1{font-size:clamp(20px,5.3vw,25px)!important;line-height:1.15;margin:0}
 main>header .eyebrow{display:none}
 #identity{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;max-width:100%;text-align:left;font-size:11px;gap:6px;margin:0;overflow-wrap:anywhere}
 #identity br{display:none}#identity button{min-height:36px;margin:0 0 0 auto;padding:6px 9px;font-size:11px}
 #app,.card,.simple-job,.job-guide,.job-section,.dispatch-lane,.table-wrap{min-width:0;max-width:100%}
 .workspace-intro,body[data-role=admin] .workspace-intro,body[data-role=installer] .workspace-intro{min-height:0;padding:12px 14px;margin:12px 0;border-radius:10px;gap:10px}
 .workspace-intro h2,body[data-role=admin] .workspace-intro h2,body[data-role=installer] .workspace-intro h2{font-size:clamp(21px,5vw,26px)!important;line-height:1.15;margin:0;padding:0;max-width:100%}
 .workspace-intro:after{display:none}.workspace-intro p{margin:7px 0 0;font-size:12px}
 .workspace-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:0 0 12px;padding:0;overflow:visible}
 .workspace-tabs button{width:100%;min-width:0;min-height:44px;padding:8px 6px;font-size:12px;line-height:1.25;white-space:normal}
 .columns,.grid,.dispatch-lanes,.production-columns,.task-grid,.bid-channels,.installer-focus-layout{grid-template-columns:minmax(0,1fr);gap:12px}
 .card,.simple-job,.job-guide,.production-task{padding:14px;margin:12px 0;border-radius:10px}
 .simple-job h3,.installer-focus-pane .simple-job h3,.dispatch-lane .simple-job h3,body[data-role=admin] .compact-job>summary h3{font-size:21px;line-height:1.2}
 .simple-job:hover{transform:none}.simple-job .next-label{font-size:12px}.job-facts{gap:10px;padding-top:10px}.job-facts b{font-size:19px}
 .job-guide h2,.installer-job-detail .job-guide h2,body[data-role=installer] .photo-first-card h2{font-size:24px!important;line-height:1.2;margin:8px 0 12px}
 body[data-role=installer] .photo-first-card{padding:14px;margin:12px 0;border-radius:10px}
 body[data-role=installer] .photo-first-image,.installer-detail-photo,.installer-site-preview{height:170px;margin:-14px -14px 14px}
 body[data-role=installer] .photo-first-options{grid-template-columns:minmax(0,1fr);gap:10px;margin:12px 0}
 body[data-role=installer] .photo-first-option{padding:14px}body[data-role=installer] .photo-first-option strong{font-size:18px}
 .installer-job-queue{grid-template-columns:minmax(0,1fr);padding:12px}.job-progress{gap:8px}.job-progress li{font-size:12px}
 input,select,textarea,dialog input,dialog select,dialog textarea{font-size:16px!important;min-width:0;max-width:100%}
 input[type=file]{font-size:14px!important;padding:10px 8px}input[type=checkbox],input[type=radio]{width:auto;min-height:0;flex:0 0 auto}
 button,.button,summary{touch-action:manipulation}button,.button{min-height:44px;max-width:100%;line-height:1.3;white-space:normal;overflow-wrap:anywhere}
 .row.work-actions,.new-actions{gap:8px}.work-actions>button{flex:1 1 150px}.row>button{max-width:100%}
 dialog{width:calc(100vw - 20px);max-width:560px;max-height:85dvh;padding:18px;overflow:auto;overscroll-behavior:contain}dialog h2{font-size:22px}
 .table-wrap{overflow-x:auto}.phone-table,.phone-table tbody,.phone-table tr,.phone-table td{display:block;width:100%;min-width:0}
 .phone-table thead{display:none}.phone-table tr{padding:8px;border:1px solid var(--line);border-radius:8px;margin:0 0 12px}
 .phone-table td{padding:7px 5px;white-space:normal;overflow-wrap:anywhere}.phone-table td:before{content:attr(data-label);display:block;font-size:11px;font-weight:700;color:var(--muted);margin-bottom:2px}
 .phone-table td button{margin:3px 4px 3px 0}.phone-table td:last-child{border-bottom:0}.phone-table td[colspan]:before{display:none}
 .branch-calendar{min-width:0;max-width:100%;overscroll-behavior-x:contain}.branch-calendar>.calendar-entry{width:100%;min-height:44px;text-align:left}
 .photos{gap:8px}.photos a,.photos img{max-width:100%}pre{white-space:pre-wrap;overflow-wrap:anywhere;max-width:100%}
 .signed-out #app{display:block;min-height:0}.signed-out .login-brand{padding:8px 0 16px}.signed-out .brand-headline{font-size:clamp(35px,10vw,58px);line-height:.95}
 .signed-out .brand-intro{font-size:13px}.signed-out .brand-stats{display:none}.signed-out .login{width:100%;max-width:100%;margin:12px 0;padding:18px}.signed-out .login h2{font-size:23px}
 footer{flex-direction:column;gap:8px;margin-top:24px}.footer-name{font-size:17px}.footer-locations{font-size:11px}
 #notice:not(:empty){position:static;overflow-wrap:anywhere}
 #liveUpdates{bottom:max(12px,env(safe-area-inset-bottom));left:10px;right:10px}
}
@media(max-width:350px){.workspace-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-unit .brand-name{font-size:14px!important;max-width:115px}.nav-inner{padding-inline:10px!important;gap:6px!important}.portal-home{padding-inline:8px}.portal-menu>summary{padding-inline:8px}}
@media(min-width:701px) and (max-width:820px){.portal-menu{position:relative}.portal-menu>summary{display:block}.portal-menu nav{position:absolute;right:0;top:50px;display:flex;flex-direction:column;align-items:stretch;background:#fff;padding:10px;border:1px solid #dce3e8;border-radius:8px;box-shadow:0 8px 24px #14273122}.portal-menu nav>button{width:100%;text-align:left}.portal-tools{width:100%}.tools-links{position:static;width:100%;box-shadow:none}}

@media(max-width:820px){main,.signed-out main{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right));padding-bottom:max(28px,env(safe-area-inset-bottom))}.nav-inner{padding-left:max(10px,env(safe-area-inset-left))!important;padding-right:max(10px,env(safe-area-inset-right))!important}#liveUpdates{position:fixed;z-index:45;margin:0;padding:10px;background:#fff;color:#17394f;border:1px solid #ccd8df;border-radius:8px;box-shadow:0 4px 24px #14273122;font-size:12px;display:flex;align-items:center;gap:8px}#liveUpdates span{flex:1;min-width:0}#liveUpdates button{flex:0 0 auto;padding:8px}}

@media(max-width:820px){body[data-role=installer] .photo-first-card label{color:#486a80}}