.a2-recipe-overview{margin-bottom:12px}.a2-recipe-product-summary{display:flex;align-items:center;gap:20px;padding:14px;flex-wrap:wrap}.a2-recipe-product-summary>a,.a2-tree-material-name>a,.a2-tree-total>a,.a2-tree-replacement>a{display:flex;align-items:center;gap:10px;color:var(--grade,#e0e2e4)}.a2-recipe-product-summary>span{font-size:13px;color:#a6a8ac}
.a2-tree-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:12px}.a2-tree-toolbar label{display:flex;align-items:center;gap:10px;margin-right:auto;font-size:13px}.a2-tree-toolbar input{width:84px}.a2-tree-toolbar input,.a2-tree-toolbar button{background:#292b2d;color:#e2e4e6;border:0;border-radius:3px;padding:7px 10px;font:inherit;font-size:13px}.a2-tree-note{margin:0;padding:0 12px 12px;color:#9b9fa4;font-size:12px;line-height:1.6}
.a2-material-tree{list-style:none;margin:0;padding:0 12px 8px}.a2-material-tree .a2-material-tree{margin-left:26px;padding:0 0 0 14px;border-left:1px solid #303234}.a2-material-tree[hidden]{display:none}.a2-tree-material{display:flex;align-items:center;gap:8px;padding:8px;margin:4px 0;background:#242628;border-radius:3px}.a2-tree-material-name{flex:1;min-width:0}.a2-tree-material-name b{font-size:14px;font-weight:500}.a2-tree-material-name small{display:block;margin:4px 0 0 46px;color:#969ca2;font-size:12px}.a2-tree-material-name small a{color:#c1b08a}.a2-tree-material-name small strong{color:#efb45e;font-weight:400}.a2-tree-required{color:#efb45e;font-size:14px;white-space:nowrap}.a2-tree-spacer,[data-tree-toggle]{width:24px;flex:0 0 24px}[data-tree-toggle]{height:28px;border:0;border-radius:3px;background:transparent;display:grid;place-items:center;cursor:pointer}[data-tree-toggle]:hover{background:#393b3e}[data-tree-toggle] img{width:18px;height:18px;filter:invert(.8)}[data-tree-toggle][aria-expanded=false] img{transform:rotate(-90deg)}.a2-tree-replacement{display:flex;align-items:center;gap:8px;margin:6px 0 0 46px;color:#999;font-size:12px}.a2-tree-replacement .a2-relation-icon{width:24px;height:24px}.a2-tree-replacement b{font-size:12px}
.a2-tree-totals{padding:12px;background:#202224}.a2-tree-totals h2{font-size:15px;margin:0 0 6px}.a2-tree-totals .a2-tree-note{padding:0 0 10px}.a2-tree-totals>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.a2-tree-total{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px;background:#282a2c;border-radius:3px;font-size:13px}.a2-tree-total b{font-weight:500}.a2-tree-total> b{color:#efb45e;white-space:nowrap}@media(max-width:700px){.a2-tree-totals>div{grid-template-columns:1fr}.a2-material-tree .a2-material-tree{margin-left:8px;padding-left:8px}.a2-tree-material{padding:6px;gap:5px}.a2-tree-material-name small,.a2-tree-replacement{margin-left:0}}

.a2-recipe-overview h1{font-size:18px;line-height:1.4;margin:5px 0 0;font-weight:500}

/* Compact material rows retain the hierarchy without oversized cards. */
.a2-material-tree .a2-material-tree{margin-left:12px;padding-left:8px;border-left-color:#2b2d30}
.a2-tree-material{min-height:38px;padding:4px 6px;margin:2px 0;gap:6px;background:#202224}
.a2-tree-material:hover{background:#292b2d}
.a2-tree-material-name{display:flex;align-items:center;flex-wrap:wrap;column-gap:14px;row-gap:2px}
.a2-tree-material-name>a{gap:7px;min-width:0}
.a2-tree-material-name>a b{font-size:13px;line-height:20px;overflow-wrap:anywhere}
.a2-tree-material-name .a2-relation-icon{width:28px;height:28px;border-radius:3px}
.a2-tree-material-name small{margin:0;font-size:11px;line-height:18px}
.a2-tree-spacer,[data-tree-toggle]{width:20px;flex-basis:20px}
[data-tree-toggle]{height:28px}
.a2-tree-required{font-size:13px;padding-left:6px;font-variant-numeric:tabular-nums}
.a2-tree-replacement{margin:0;gap:6px}
.a2-tree-replacement .a2-relation-icon{width:22px;height:22px}
.a2-tree-total{padding:5px 8px;gap:8px}
.a2-tree-total .a2-relation-icon{width:28px;height:28px;border-radius:3px}
@media(max-width:700px){.a2-material-tree{padding-right:8px;padding-left:8px}.a2-material-tree .a2-material-tree{margin-left:6px;padding-left:6px}.a2-tree-material-name{column-gap:8px}.a2-tree-material-name small{font-size:10px}.a2-tree-material{gap:4px}}