/* Orrery side panels — gap · shop · gap · info · gap
   Full height, equal width, wider + more toward center. */
.side-panel-overlay{
  --panel-edge-gap:clamp(0.5rem,1.5vw,1.25rem);
  --panel-mid-gap:clamp(0.5rem,1.25vw,1rem);
  --panel-width:min(520px,calc((100vw - 2 * var(--panel-edge-gap) - var(--panel-mid-gap)) / 2));
}
.side-panel{
  top:0;
  bottom:0;
  right:var(--panel-edge-gap);
  left:auto;
  height:100%;
  width:var(--panel-width);
  border:1px solid var(--border);
  border-left:1px solid var(--border);
  border-radius:0;
  box-shadow:0 0 32px rgba(0,0,0,.35);
  transform:translateX(calc(100% + var(--panel-edge-gap) + 8px));
}
.side-panel-overlay.open .side-panel{transform:translateX(0);}
.shop-panel{
  top:0;
  bottom:0;
  left:var(--panel-edge-gap);
  right:auto;
  height:100%;
  width:var(--panel-width);
  border:1px solid rgba(255,107,53,.25);
  border-right:1px solid rgba(255,107,53,.25);
  border-radius:0;
  box-shadow:0 0 32px rgba(0,0,0,.35);
  transform:translateX(calc(-100% - var(--panel-edge-gap) - 8px));
}
.side-panel-overlay.open .shop-panel{transform:translateX(0);}
@media (max-width:768px){
  .side-panel{
    left:var(--panel-edge-gap);
    right:var(--panel-edge-gap);
    width:auto;
    max-width:none;
  }
}
@media (max-width:600px){
  .shop-panel{display:none;}
}

/* Carousel mode: keep orrery in focus (no blur wash) */
.side-panel-overlay.carousel-focus .side-panel-backdrop{
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  pointer-events:none;
}