.cost-tabs { display:flex; gap:8px; flex-wrap:wrap; margin:0 0 20px; }
.cost-list-item { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:20px 0; border-top:1px solid var(--line); }
.cost-list-item > div:first-child { min-width:0; }
.cost-list-item strong, .recipe-line-title strong { overflow-wrap:anywhere; }
.cost-list-prices, .cost-material-summary { display:flex; gap:10px 24px; flex-wrap:wrap; font-size:14px; }
.cost-list-item p { margin:6px 0 10px; }
.cost-item-actions { display:flex; gap:8px; flex-shrink:0; flex-wrap:wrap; }
.cost-missing { color:var(--warn); font-size:14px; font-weight:600; }
.cost-editor { display:grid; gap:20px; }
.cost-editor .card { margin-bottom:0; }
.recipe-line { border:1px solid var(--line); border-radius:12px; padding:18px; margin-bottom:14px; }
.recipe-line-title { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:12px; }
.recipe-line-title small { display:block; color:var(--muted); margin-top:4px; }
.recipe-line-body { display:grid; grid-template-columns:minmax(180px,240px) minmax(0,1fr); gap:26px; }
.recipe-quantity { display:grid; grid-template-columns:minmax(80px,1fr) 85px; gap:10px; align-content:start; }
.recipe-quantity .field { min-width:0; }
.recipe-quantity input, .recipe-quantity select { width:100%; }
.recipe-calculation { min-width:0; }
.recipe-calculation > p { margin:0 0 10px; }
.recipe-result-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px 24px; }
.recipe-result-grid strong { display:block; font-size:20px; margin:4px 0; }
.recipe-result-grid small { display:block; color:var(--muted); overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.cost-label { display:block; font-size:13px; color:var(--muted); }
.cost-label small { display:inline; margin-left:8px; }
.cost-summary-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; }
.cost-summary { border:1px solid var(--line); background:var(--paper); padding:20px; border-radius:12px; }
.cost-summary span, .cost-summary strong, .cost-summary small { display:block; }
.cost-summary strong { font-size:32px; margin:6px 0; }
.cost-summary small { color:var(--muted); }
.cost-summary.incomplete { border-color:#e9c394; background:#fff8ed; }
.cost-picker { padding-top:12px; border-top:1px solid var(--line); }
.cost-picker summary { cursor:pointer; font-weight:600; margin-bottom:14px; }
#cost-picker-results { max-height:330px; overflow:auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; }
.cost-material-choice { border:1px solid var(--line); background:white; border-radius:10px; padding:12px; text-align:left; color:var(--ink); min-width:0; }
.cost-material-choice:hover { border-color:var(--brand-2); background:var(--paper); }
.cost-material-choice strong, .cost-material-choice small, .cost-material-choice span { display:block; overflow-wrap:anywhere; }
.cost-material-choice small { color:var(--muted); margin:5px 0 8px; }
.cost-material-choice span { color:var(--brand-2); font-size:13px; }
.cost-material-choice:disabled { opacity:.5; cursor:default; }
.material-cost-fields { border:1px solid var(--line); border-radius:12px; margin:20px 0; padding:18px; min-width:0; }
.material-cost-fields legend { padding:0 8px; font-weight:600; }
.cost-material-editor { max-width:860px; }
@media(max-width:720px) {
  .cost-list-item { align-items:flex-start; flex-direction:column; gap:12px; }
  .cost-item-actions { width:100%; }
  .recipe-line-body { grid-template-columns:1fr; gap:12px; }
  .recipe-quantity { grid-template-columns:minmax(100px,1fr) 90px; }
  .recipe-line { padding:14px; }
  .cost-summary-grid { grid-template-columns:1fr; }
  .cost-material-summary { flex-direction:column; gap:6px; }
  #cost-picker-results { grid-template-columns:1fr; }
}