/* One unit-page layout (Phil Nov 8 2026: featured and narrow inventory pages should look like the wide inventory pages).
   The narrow template keeps its phone layout; from 1000px wide: photos left, title / price / Paul right (sticky). Loaded by nginx. */
/* tablets / big phones: the narrow pages fill the screen like the other unit pages */
@media (min-width:521px) and (max-width:999px){
  div[style*="max-width:520px"]:has(h1){max-width:100%!important}
  div[style*="position:fixed"][style*="bottom:0"] > div[style*="max-width:496px"]{max-width:760px!important}
}
/* pages the script couldn't split still get wider on a computer */
@media (min-width:1000px){
  div[style*="max-width:520px"]:has(h1){max-width:860px!important}
}
@media (min-width:1000px){
  div[style*="max-width:520px"]:has(> #vhwide-aside){max-width:1240px!important;display:grid!important;grid-template-columns:minmax(0,1.5fr) minmax(360px,1fr);column-gap:28px;align-items:start;padding-bottom:40px!important}
  div[style*="max-width:520px"]:has(> #vhwide-aside) > *{grid-column:1;min-width:0}
  div[style*="max-width:520px"]:has(> #vhwide-aside) > header,
  div[style*="max-width:520px"]:has(> #vhwide-aside) > div[style*="repeating-linear-gradient"],
  div[style*="max-width:520px"]:has(> #vhwide-aside) > div[style*="repeating-linear-gradient"] + div,
  div[style*="max-width:520px"]:has(> #vhwide-aside) > .vhs,
  div[style*="max-width:520px"]:has(> #vhwide-aside) > footer{grid-column:1 / -1}
  div[style*="max-width:520px"]:has(> #vhwide-aside) > .vhs + div{grid-column:1 / -1}
  div[style*="max-width:520px"]:has(> #vhwide-aside) > #vhwide-left{grid-column:1!important;display:flex;flex-direction:column;min-width:0}
  div[style*="max-width:520px"]:has(> #vhwide-aside) > #vhwide-aside{grid-column:2!important;align-self:start;position:sticky;top:132px;display:flex;flex-direction:column;gap:6px}
  #vhwide-aside > section{margin-left:0!important;margin-right:0!important;padding-left:0!important;padding-right:0!important}
  #vhwide-aside h1{font-size:34px!important}
  body:has(#vhwide-aside) > div > div[style*="position:fixed"][style*="bottom:0"],
  body:has(#vhwide-aside) div[style*="position:fixed;bottom:0"]{display:none!important}
  div[style*="max-width:520px"]:has(> #vhwide-aside) #herowrap{border-radius:4px}
}
