#shopPlanner{flex:none;margin:var(--hud-space-2) 0;min-width:0;}
#shopPlanner h3,#shopPlanParts{margin:0;}
#shopRecommendedBuy{display:flex;align-items:center;gap:var(--hud-space-2);text-align:left;white-space:normal;min-height:var(--hud-target);}
#shopRecommendedArt{flex:none;width:var(--hud-target);height:var(--hud-target);display:grid;place-items:center;}
#shopRecommendedArt .itemIcon{width:100%;height:100%;}
#shopPlanSelect{min-width:0;width:100%;min-height:var(--hud-target);}
#shopPlanParts{font-size:var(--hud-text-sm);}
#shopPlanner summary{min-height:var(--hud-target);cursor:pointer;display:flex;align-items:center;}
#shopPlanner details[open]{max-height:min(70vh,520px);overflow:auto;}
@media(max-height:400px){#shopPlanner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;}#shopRecommendationTitle{grid-column:1/-1;}#shopPlanParts{grid-column:1/-1;}}
/* Build path: planned item on top, components underneath, connectors drawn with
   pseudo-elements. Nodes are icon + price like a MOBA recipe tree; the name sits
   under the price so no part needs a hover to be understood. */
#shopBuildPath{overflow-x:auto;overflow-y:hidden;padding:var(--hud-space-2) 0 var(--hud-space-1);margin-top:var(--hud-space-2);}
#shopBuildPath[hidden],#shopBuildFocus[hidden],#shopBuildFocusBuy[hidden]{display:none;}
#shopBuildPath>.buildBranch{width:max-content;min-width:100%;}
.buildBranch{position:relative;display:flex;flex-direction:column;align-items:center;flex:1 0 auto;}
.buildTier{position:relative;display:flex;justify-content:center;align-items:flex-start;gap:var(--hud-space-1);padding-top:14px;width:100%;}
.buildTier::before{content:'';position:absolute;top:0;left:50%;width:2px;height:14px;background:var(--hud-border-subtle);}
.buildTier>.buildBranch::before{content:'';position:absolute;top:0;left:50%;width:2px;height:14px;background:var(--hud-border-subtle);}
.buildTier>.buildBranch{padding-top:14px;}
.buildTier>.buildBranch::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--hud-border-subtle);}
.buildTier>.buildBranch:first-child::after{left:50%;}
.buildTier>.buildBranch:last-child::after{right:50%;}
.buildTier>.buildBranch:only-child::after{display:none;}
.buildNode{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;width:84px;padding:var(--hud-space-1);
  background:var(--hud-surface-inset);border:var(--hud-border-width) solid var(--hud-border-subtle);border-radius:var(--hud-radius);
  color:var(--hud-text);font:var(--hud-text-xs)/1.25 var(--hud-font-body);cursor:pointer;touch-action:manipulation;}
.buildNode .buildArt{display:grid;place-items:center;width:36px;height:36px;}
.buildNode .buildArt .itemArt{width:36px;height:36px;}
.buildNode .buildPrice{color:var(--hud-accent);font-weight:var(--hud-weight-strong);font-size:var(--hud-text-sm);}
.buildNode .buildName{color:var(--hud-text-muted);text-align:center;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.buildNode.root{width:96px;border-color:var(--hud-border);}
.buildNode.pricey .buildPrice{color:var(--hud-danger);}
.buildNode.owned{border-color:var(--hud-health);}
.buildNode.owned .buildPrice{color:var(--hud-health);}
.buildNode.merged{opacity:.55;}
.buildNode.next{border-color:var(--hud-accent);box-shadow:0 0 0 1px var(--hud-accent),0 0 10px rgba(242,193,78,.45);animation:buildNext 1.2s ease-in-out infinite;}
@keyframes buildNext{50%{box-shadow:0 0 0 1px var(--hud-accent),0 0 16px rgba(242,193,78,.85);}}
.buildNode.focus{background:var(--hud-surface-raised);border-color:var(--hud-focus);}
.buildNode:hover{border-color:var(--hud-focus);}
#shopBuildFocus{display:flex;align-items:center;gap:var(--hud-space-2);flex-wrap:wrap;margin-top:var(--hud-space-2);}
#shopBuildFocusCopy{flex:1 1 180px;min-width:0;font-size:var(--hud-text-sm);}
#shopBuildFocusBuy{flex:none;padding:var(--hud-space-1) var(--hud-space-3);white-space:nowrap;}
#shopBuildFocusBuy:disabled{opacity:.5;cursor:default;}
@media(max-width:600px){.buildNode{width:62px;padding:3px;}.buildNode.root{width:80px;}.buildNode .buildArt,.buildNode .buildArt .itemArt{width:28px;height:28px;}.buildNode .buildPrice{font-size:var(--hud-text-xs);}.buildTier{gap:2px;}}