/* Shared preview radar presentation in either orientation. */
body[data-menu-section=workshop] #shopOverlay #workshopCompare:not(.is-collapsed){max-height:calc(100dvh - 80px)!important;overflow-y:auto!important}
body[data-menu-section=workshop] #workshopCompare .compareTopName{display:flex;align-items:center;justify-content:center;gap:6px;min-width:0}
body[data-menu-section=workshop] #workshopCompare .compareTopName img{width:30px;height:30px;object-fit:contain;flex:none}
body[data-menu-section=workshop] #workshopCompare .compareTopName>span{overflow-wrap:anywhere;text-align:left;font-size:11px}
body[data-menu-section=workshop] #workshopCompare .compareVisual{display:block;min-width:0}
body[data-menu-section=workshop] #workshopCompare .compareRow>b{color:#8feaff;font:800 13px system-ui}
body[data-menu-section=workshop] #workshopCompare .workshopRadar{display:block!important;position:static;width:100%;max-width:none;padding:0;margin:0;background:none;border:0;border-radius:0;box-shadow:none}
body[data-menu-section=workshop] #workshopCompare .workshopRadar svg{width:100%;height:auto;aspect-ratio:240/154}
body[data-menu-section=workshop] #workshopCompare .radarLabels{display:block!important;fill:#d9f5ff;font:700 12px system-ui}
body[data-menu-section=workshop] #workshopCompare .radarLabels text{text-anchor:middle}
body[data-menu-section=workshop] #shopOverlay #workshopCompare .compactRatings{display:none!important}
body[data-menu-section=workshop] #workshopCompare .radarGrid{stroke:rgba(255,255,255,.55)!important;fill:none}
body[data-menu-section=workshop] #shopOverlay #portraitHero>.workshopRadar{
 position:absolute!important;top:-14px!important;right:-24px!important;left:auto!important;bottom:auto!important;
 width:210px!important;min-width:0!important;max-width:65%!important;padding:6px 4px 2px!important;
 background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;pointer-events:none;
}
body[data-menu-section=workshop] #shopOverlay #portraitHero>.workshopRadar svg{display:block;width:100%!important;height:auto!important;aspect-ratio:240/190;overflow:visible}
body[data-menu-section=workshop] #portraitHero>.workshopRadar::after{content:none!important}
body[data-menu-section=workshop] #portraitHero>.workshopRadar .compactRatings{display:none!important}
body[data-menu-section=workshop] #portraitHero>.workshopRadar .radarLabels{transform:none!important}
body[data-menu-section=workshop] #portraitHero>.workshopRadar .radarLabels text{display:inline!important;visibility:visible!important;font:700 12px system-ui!important;text-anchor:middle!important;letter-spacing:0!important;fill:#d9f5ff}
body[data-menu-section=workshop] #portraitHero>.workshopRadar .radarGrid{stroke:rgba(255,255,255,.55)!important;fill:none}
body[data-menu-section=workshop] #portraitHero>.workshopRadar .radarShape{stroke:var(--radar-accent)!important;fill:color-mix(in srgb,var(--radar-accent) 28%,transparent)!important;filter:drop-shadow(0 0 5px var(--radar-accent));transform-box:fill-box;transform-origin:center;animation:workshopRadarReveal .55s ease-out both}
body[data-menu-section=workshop] #portraitHero>.workshopRadar .radarEquipped{stroke-dasharray:4 2;fill:color-mix(in srgb,var(--radar-accent) 10%,transparent)!important}
@media(prefers-reduced-motion:reduce){body[data-menu-section=workshop] #portraitHero>.workshopRadar .radarShape{animation:none!important}}
/* Embedded portrait viewports must scroll instead of crushing the radar row. */
@media (orientation:portrait){
 body[data-menu-section=workshop] #shopOverlay #shopScroll:has(#workshopCompare:not([hidden]):not(.is-collapsed)){
  grid-template-rows:minmax(300px,40vh) minmax(190px,max-content) minmax(240px,1fr);
  overflow-y:auto!important;overscroll-behavior:contain;touch-action:pan-y;
 }
 body[data-menu-section=workshop] #shopOverlay #shopScroll > #workshopCompare:not([hidden]):not(.is-collapsed){
  min-height:190px!important;height:auto;flex-shrink:0;
 }
}
