/* Responsive interaction refinements shared by mouse and touch browsers. */
button{-webkit-appearance:none;appearance:none;touch-action:manipulation}
summary{touch-action:manipulation}
.modal-close{z-index:3}
body:has(.mobile-view-expanded){overflow:hidden}
.empty{font-size:15px;line-height:1.6}
.workspace,.catalog-view{overflow-anchor:none}

@media(max-width:900px),(max-width:1024px) and (max-height:600px){
 :root{--mobile-header:calc(65px + env(safe-area-inset-top,0px))}
 .evocars-header{height:var(--mobile-header);padding-top:env(safe-area-inset-top,0px)}
 #configuration,#intro{scroll-margin-top:var(--mobile-header)}
 #configuration{padding-left:max(8px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
 .evocars-intro{min-height:max(360px,calc(100svh - var(--mobile-header)))}
 .step-content{padding-right:max(16px,env(safe-area-inset-right,0px))}
 dialog{width:calc(100% - 16px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px));max-height:calc(100dvh - 24px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}
 .workspace,.catalog-view{min-height:0}
 .workspace{grid-template-rows:clamp(210px,31dvh,270px) minmax(0,1fr)}
 .showroom:not(.is-interior):not(.mobile-view-expanded) .showroom-heading{position:relative;inset:auto;flex-shrink:0;min-height:58px;padding:6px 12px;align-items:center;gap:8px}
 .showroom-heading h1{font-size:20px;margin-bottom:3px}
 .showroom-heading p{font-size:11px}
 .view-switch{flex-shrink:0}
 .view-switch button{min-height:44px;padding:7px 8px;font-size:11px}
 .viewer-bottom .icon-button{width:44px;min-width:44px;height:44px}
 .showroom.is-interior:not(.mobile-view-expanded) .viewer-bottom{top:12px;bottom:auto;left:12px;right:auto}
 .evocars-header .evocars-brand{display:flex;align-items:center;min-height:44px}
 .evocars-header .model-switch{padding:2px;gap:2px}
 .evocars-header .model-switch button{min-width:44px;min-height:44px;padding:6px;font-size:12px}
 .evocars-contact-menu summary{width:44px;height:44px}
 .evocars-contact-card{max-height:calc(100dvh - var(--mobile-header) - 24px);overflow:auto;overscroll-behavior:contain}
 .evocars-contact-card>a,.evocars-messengers a{display:flex;align-items:center;min-height:44px}
 .evocars-contact-card{gap:8px;padding:18px}
 .evocars-intro-secondary{min-height:44px!important}
 .summary-content{padding-top:56px}
 .summary-content h2{overflow-wrap:anywhere}
 .summary-content .primary{width:100%;margin-top:10px;white-space:normal}
 .source-link{min-height:44px;display:flex;align-items:center}
 .evocars-footer{padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px))}
 .evocars-header{padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px))}
 body.keyboard-open{--mobile-footer:0px;--mobile-workspace:calc(var(--visible-height,100dvh) - var(--mobile-header) - var(--mobile-steps));padding-bottom:0}
 body.keyboard-open .evocars-footer{display:none}
 body.keyboard-open .catalog-view{height:var(--mobile-workspace);min-height:0}
 body.keyboard-open .catalog-heading>div,body.keyboard-open #back-to-car{display:none}
 body.keyboard-open .catalog-heading{margin-bottom:12px}
}
@media(max-width:360px){
 .evocars-header{gap:6px}
 .showroom-heading h1{font-size:18px}
 .showroom-heading p{font-size:10px}
 .view-switch button{font-size:10px;padding:6px}
 .workspace[data-step="1"] .compact-options,.workspace[data-step="2"] .compact-options{gap:8px}
 .compact-body{padding:10px}
}
@media(max-width:900px) and (max-height:650px) and (orientation:portrait){
 .workspace{grid-template-rows:160px minmax(0,1fr)}
}
@media(min-width:761px) and (max-width:900px) and (min-height:601px){
 :root{--mobile-header:calc(78px + env(safe-area-inset-top,0px))}
 .workspace{grid-template-rows:clamp(280px,36dvh,370px) minmax(0,1fr)}
}
@media(max-width:1024px) and (max-height:600px) and (orientation:landscape){
 :root{--mobile-header:calc(54px + env(safe-area-inset-top,0px));--mobile-footer:calc(70px + env(safe-area-inset-bottom,0px))}
 .workspace{grid-template-rows:minmax(0,1fr)}
 .evocars-footer{padding-bottom:calc(6px + env(safe-area-inset-bottom,0px))}
 .evocars-footer .price-block{gap:2px}
 .evocars-footer .price-block>span{line-height:1.2}
 .evocars-footer .price-block .mobile-price-hint{font-size:10px;line-height:1.2}
 .showroom:not(.is-interior):not(.mobile-view-expanded) .showroom-heading{min-height:52px;padding:3px 8px;gap:4px}
 .showroom-heading h1{font-size:16px}
 .showroom-heading p{font-size:10px}
 .view-switch button{font-size:10px;padding:6px}
 .evocars-intro-actions a{min-width:0}
 .evocars-intro{min-height:calc(100svh - var(--mobile-header))}
}
/* At heavy browser zoom, let the document scroll instead of crushing panels. */
@media(max-height:300px){
 .evocars-header,#configuration{position:relative;top:auto}
 .workspace{height:auto;min-height:400px}
 .catalog-view{height:auto;min-height:0;overflow:visible}
 .evocars-footer{position:relative;min-height:var(--mobile-footer,90px);height:auto}
 body{padding-bottom:0}
 .evocars-intro{min-height:300px}
}
@media(max-width:1024px) and (max-height:300px){
 .workspace{display:flex;flex-direction:column;min-height:0}
 .showroom,.showroom.is-interior{height:220px;flex:none}
 .config-panel,.step-content{overflow:visible}
 .showroom.mobile-view-expanded{height:100dvh}
}
