/* Phone-only presentation: desktop rules stay unchanged. */
@media (max-width:700px), (pointer:coarse) and (max-width:1000px) {
  body{display:block;height:auto;min-height:100dvh}
  aside{display:grid;grid-template-columns:minmax(0,1fr) 180px;column-gap:12px;row-gap:6px;padding:calc(18px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 18px max(16px,env(safe-area-inset-left))}
  .brands{float:none;grid-column:2;grid-row:1 / span 2;width:180px;align-self:center;gap:12px}
  .range{margin:0;font-size:9px;letter-spacing:2px;align-self:end}
  .model{margin:0;font-size:21px;letter-spacing:.5px}.model span{display:inline;font-size:13px;margin-left:7px}
  nav{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px 10px;margin-top:18px}
  nav h2{font-size:10px;letter-spacing:1px;line-height:1.5;margin:8px 0}
  nav h2:nth-of-type(2){grid-column:2;grid-row:1}nav button:nth-of-type(3){grid-column:2;grid-row:2}nav button:nth-of-type(4){grid-column:2;grid-row:3}
  nav button{min-height:48px;padding:10px 9px;font-size:12px;line-height:1.45;overflow-wrap:anywhere;touch-action:manipulation}
  .presented{grid-column:1/-1;display:block;margin-top:8px;padding:0;font-size:10px}
  .divider{display:none}main{padding:20px max(16px,env(safe-area-inset-right)) calc(20px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));overflow:visible;gap:0}
  header{align-items:center;gap:12px;margin-bottom:16px}h1{font-size:21px}#code{max-width:125px;font-size:10px;line-height:1.5;text-align:right;overflow-wrap:anywhere}
  .stage:not(:fullscreen):not(.expanded){flex:none;width:100%;height:auto;min-height:0;aspect-ratio:16/9;touch-action:pan-y pinch-zoom}
  .stage:not(:fullscreen):not(.expanded) #viewer{width:100%;height:100%}
  .details{min-height:72px;gap:12px;padding:14px 0 12px}.details>div{min-width:0}#title{font-size:15px;line-height:1.4}#render{font-size:11px;line-height:1.6;margin-top:5px;overflow-wrap:anywhere}#position{flex-shrink:0;font-size:11px;padding-top:3px}
  .filters{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 14px;padding:14px 0}
  .filters strong{grid-column:1/-1;font-size:13px;width:auto;margin:0 0 2px}
  fieldset{display:grid;grid-template-columns:minmax(0,1fr);gap:0;padding:0;margin:0;min-width:0}
  legend{display:block;float:none;font-size:11px;line-height:1.5;margin:0 0 5px;padding:0;color:#939e95}
  label{position:relative;min-height:44px;padding-left:48px;font-size:13px;gap:0;cursor:pointer}
  label button{position:absolute;left:0;top:0;width:44px;height:44px;border:0;padding:0;background:transparent;touch-action:manipulation}
  label button:before{position:absolute;left:3px;top:12px;width:36px;height:20px;border:1px solid #626b63;border-radius:12px;background:#323833;transform:none}
  label button:after{content:'';position:absolute;left:7px;top:16px;width:12px;height:12px;border-radius:50%;background:#a4afa5;transition:transform .15s}
  label button[aria-checked=true]{background:transparent}label button[aria-checked=true]:before{background:#798c7c;transform:none}label button[aria-checked=true]:after{transform:translateX(16px);background:#eff2e9}
  .gallery-row{height:136px;min-height:136px;margin-top:4px;gap:4px;min-width:0}.arrow{flex:0 0 44px;width:44px;min-height:48px;padding:8px;font-size:30px;touch-action:manipulation}
  #gallery{min-width:0;gap:10px;padding:5px 2px 12px;overscroll-behavior-x:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y pinch-zoom}
  .thumb{flex-basis:144px;min-height:110px;scroll-snap-align:start;touch-action:manipulation}.thumb .tile{height:81px}.thumb span:last-child{font-size:11px;line-height:1.4;margin-top:8px}
  footer{flex-wrap:wrap;gap:8px 20px;line-height:1.5;font-size:10px;margin-top:16px}
  .pending-name{font-size:11px;text-align:center;line-height:1.5;padding-inline:16px}.pending-status{font-size:11px;text-align:center;padding-inline:16px}.pending-icon{font-size:24px;margin-bottom:10px}
  #viewer .load-status{max-width:calc(100% - 24px);white-space:normal;text-align:center;overflow-wrap:anywhere;bottom:10px;font-size:11px}.image-retry{min-height:44px;min-width:88px}
  .fullscreen-toggle{width:44px;height:44px;top:8px;right:8px;touch-action:manipulation}
  .stage:fullscreen,.stage.expanded{width:100%;height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
  .stage:fullscreen #viewer,.stage.expanded #viewer{width:min(100%,calc((100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)) * 16 / 9));height:auto;max-height:100%;aspect-ratio:16/9}
  .stage:fullscreen .fullscreen-toggle,.stage.expanded .fullscreen-toggle{top:max(8px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right))}
  .stage:fullscreen .fullscreen-nav,.stage.expanded .fullscreen-nav{left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right))}.fullscreen-nav button{width:44px;height:48px;touch-action:manipulation}
}
@media (max-width:360px){aside{grid-template-columns:1fr}.brands{grid-column:1;grid-row:1;width:180px;margin-bottom:14px}.range{grid-row:2}.model{grid-row:3}nav{margin-top:10px}header{flex-wrap:wrap}#code{text-align:left;max-width:none}}
@media (prefers-reduced-motion:reduce){@media (max-width:700px), (pointer:coarse) and (max-width:1000px){label button:after{transition:none}}}

