@media screen {
 #estimateView .estimate-table .material-line{grid-template-columns:minmax(0,1fr) auto}
 #materialPricing{margin:14px 0;border:1px solid var(--bindr-border,#ccd4df);border-radius:8px;overflow:hidden;background:var(--bindr-card,#fff)}
 #materialPricing .section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;margin:0}
 #materialPricing h2{margin:0;font-size:1.05rem}#materialPricing p{margin:4px 0 0;color:var(--bindr-muted,#566477);font-size:.875rem}
 .material-pricing-total{display:grid;gap:3px;text-align:right;white-space:nowrap}.material-pricing-total span{font-size:.8125rem;color:var(--bindr-muted,#566477)}.material-pricing-total strong{font-size:1.1rem}
 .material-buying-table{width:100%;border-collapse:collapse;font-size:.875rem;font-variant-numeric:tabular-nums;min-width:700px}
 .material-buying-table th{background:#edf0f4;font-size:.8125rem;font-weight:600;color:#405168;text-align:left;padding:9px 14px;border-block:1px solid #dbe0e7}
 .material-buying-table td{padding:12px 14px;border-bottom:1px solid #e4e8ed;vertical-align:top}.material-buying-table tbody tr:last-child td{border-bottom:0}
 .material-buying-table td:first-child{width:42%}.material-buying-table td:nth-child(3){width:160px}.material-buying-table td:nth-child(4){white-space:nowrap;font-weight:650}
 #materialPricing input[type=number]{width:120px;max-width:100%;min-height:34px;padding:6px 9px;border:1px solid #8298ae;border-radius:5px;background:#f8fbfe;color:#1c3853;font-size:.875rem;font-weight:650;text-align:right}
 .material-buying-table small{display:block;margin-top:4px;font-size:.8125rem;line-height:1.4;color:#607086}
 .material-buying-table summary{cursor:pointer}.material-buying-table summary strong{font-weight:650}.material-buying-table ul{padding-left:17px;margin:10px 0 0}.material-buying-table li{margin:7px 0;color:#405168}.material-buying-table li span{display:block;font-size:.8125rem}
 #materialPricing input[type=checkbox]{width:15px;min-height:15px;margin:0}
 #materialPricing .material-pricing-empty{padding:18px 16px;margin:0}
 /* One layout owner: unique named areas avoid row collisions when panels move. */
 #estimateView #allowanceInputs{grid-template-columns:minmax(0,1fr);align-items:start}
 #estimateView #allowanceInputs>#materialPricing{margin:0;min-width:0;border-top:3px solid var(--bindr-section-accent,#445267)}
 #estimateView #allowanceInputs>.subcontract-panel{margin:0;min-width:0}
 #estimateView .estimate-pricing-support{display:grid;gap:12px;align-content:start;min-width:0;container:support-costs / inline-size}
 #estimateView #allowanceInputs .estimate-pricing-support>.compact-cost-section{min-width:0}
 #estimateView #allowanceInputs .estimate-pricing-support .allowance-row{padding:5px 0}
 #estimateView #allowanceInputs .estimate-pricing-support .compact-cost-row{grid-template-columns:minmax(100px,1.2fr) minmax(75px,.8fr) 44px minmax(100px,1fr) minmax(78px,.8fr) 28px;gap:5px}
 #estimateView #allowanceInputs .estimate-pricing-support .cost-item{grid-column:1;min-width:0}
 #estimateView #allowanceInputs .estimate-pricing-support .cost-total{grid-column:5;grid-row:1}
 #estimateView #allowanceInputs .estimate-pricing-support .cost-remove{grid-column:6;grid-row:1;justify-self:end}
 #estimateView #allowanceInputs .estimate-pricing-support .cost-options-slot:not(:empty){grid-column:1/-1;justify-self:end}
 #estimateView #allowanceInputs .estimate-pricing-support .compact-cost-row>span:empty{display:none}
 #estimateView #allowanceInputs .estimate-pricing-support .transport-cost-row{grid-template-columns:minmax(115px,1.3fr) minmax(72px,.8fr) minmax(72px,.8fr) 48px minmax(105px,1.1fr) minmax(78px,.8fr) 28px}
 #estimateView #allowanceInputs .estimate-pricing-support .transport-cost-row .cost-total{grid-column:6}
 #estimateView #allowanceInputs .estimate-pricing-support .transport-cost-row .cost-remove{grid-column:7}
 #estimateView #allowanceInputs .estimate-pricing-support .compact-part-load-row{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
 #estimateView #allowanceInputs .estimate-pricing-support .compact-part-load-row output{text-align:right;white-space:normal}
 @container support-costs (max-width:620px){
  #estimateView #allowanceInputs .estimate-pricing-support .transport-cost-row{grid-template-columns:repeat(3,minmax(0,1fr))}
  #estimateView #allowanceInputs .estimate-pricing-support .transport-cost-row .cost-item{grid-column:1/-1}
  #estimateView #allowanceInputs .estimate-pricing-support .transport-cost-row .cost-total{grid-column:2;grid-row:3}
  #estimateView #allowanceInputs .estimate-pricing-support .transport-cost-row .cost-remove{grid-column:3;grid-row:3}
 }
 @container support-costs (max-width:480px){
  #estimateView #allowanceInputs .estimate-pricing-support .compact-cost-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  #estimateView #allowanceInputs .estimate-pricing-support .cost-item{grid-column:1/-1}
  #estimateView #allowanceInputs .estimate-pricing-support :is(.cost-total,.cost-remove){grid-column:auto;grid-row:auto}
  #estimateView #allowanceInputs .estimate-pricing-support .transport-cost-row :is(.cost-total,.cost-remove){grid-column:auto;grid-row:auto}
 }
 @container allowance-layout (min-width:1100px){
  #estimateView #allowanceInputs{
   grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);
   grid-template-areas:"materials support" "plant plant" "daily waiting" "extras subcontract";
  }
  #estimateView #allowanceInputs>#materialPricing{grid-area:materials;align-self:stretch}
  #estimateView #allowanceInputs>.estimate-pricing-support{grid-area:support}
  #estimateView #allowanceInputs>.cost-plant{grid-area:plant}
  #estimateView #allowanceInputs>.cost-other[data-cost-basis="daily"]{grid-area:daily}
  #estimateView #allowanceInputs>[data-cost-basis="load"]{grid-area:waiting}
  #estimateView #allowanceInputs>[data-cost-basis="area"]{grid-area:extras}
  #estimateView #allowanceInputs>.subcontract-panel{grid-area:subcontract}
  #materialPricing .section-heading{align-items:flex-start;flex-wrap:wrap;gap:10px}
  #materialPricing .material-buying-table{min-width:560px}
  #materialPricing .material-buying-table :is(th,td){padding:10px 8px}
  #materialPricing .material-buying-table td:first-child{width:32%}
  #materialPricing .material-buying-table td:nth-child(3){width:105px}
  #materialPricing input[type=number]{width:90px}
  #estimateView #allowanceInputs>.subcontract-panel .section-heading{align-items:flex-start;flex-wrap:wrap;gap:8px}
  #estimateView #allowanceInputs>.subcontract-panel .table-wrap{max-width:100%}
  #estimateView #allowanceInputs>.subcontract-panel .subcontract-table{min-width:560px;table-layout:fixed}
  #estimateView #allowanceInputs>.subcontract-panel .subcontract-table :is(th,td){padding:6px 4px}
  #estimateView #allowanceInputs>.subcontract-panel .subcontract-table :is(input,select){width:100%;min-width:0;padding:6px 5px}
  #estimateView #allowanceInputs>.subcontract-panel .subcontract-table :is(th,td):nth-child(1){width:23%}
  #estimateView #allowanceInputs>.subcontract-panel .subcontract-table :is(th,td):nth-child(2){width:9%}
  #estimateView #allowanceInputs>.subcontract-panel .subcontract-table :is(th,td):nth-child(3){width:10%}
  #estimateView #allowanceInputs>.subcontract-panel .subcontract-table :is(th,td):nth-child(4){width:12%}
  #estimateView #allowanceInputs>.subcontract-panel .subcontract-table :is(th,td):nth-child(5){width:11%}
  #estimateView #allowanceInputs>.subcontract-panel .subcontract-table :is(th,td):nth-child(6){width:19%}
  #estimateView #allowanceInputs>.subcontract-panel .subcontract-table :is(th,td):nth-child(7){width:11%}
  #estimateView #allowanceInputs>.subcontract-panel .subcontract-table :is(th,td):nth-child(8){width:5%}
  #estimateView #allowanceInputs>.cost-other:is([data-cost-basis="daily"],[data-cost-basis="load"]) .compact-cost-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  #estimateView #allowanceInputs>.cost-other:is([data-cost-basis="daily"],[data-cost-basis="load"]) .cost-item{grid-column:1/-1}
  #estimateView #allowanceInputs>.cost-other:is([data-cost-basis="daily"],[data-cost-basis="load"]) .cost-remove{grid-column:auto;grid-row:auto;justify-self:end}
  #estimateView #allowanceInputs>.cost-other:is([data-cost-basis="daily"],[data-cost-basis="load"]) .cost-options-slot:not(:empty){grid-column:auto;grid-row:auto}
  #estimateView #allowanceInputs>.cost-other:is([data-cost-basis="daily"],[data-cost-basis="load"]) .compact-cost-row>span:empty{display:none}
 }
 @media(max-width:650px){#materialPricing .section-heading{align-items:flex-start;flex-wrap:wrap}.material-pricing-total{text-align:left}}
}

@media screen {
 /* Compact material strips inside the original estimating panel. */
 #estimateView #allowanceInputs>#materialPricing{align-self:start;min-height:0}
 #estimateView #materialPricing>.section-heading{padding:8px 12px;gap:8px;align-items:center;flex-wrap:nowrap}
 #materialPricing .material-pricing-total{display:flex;align-items:baseline;gap:8px;padding:0;border:0;background:none}
 #materialPricing .material-pricing-total strong{font-size:1rem}
 #materialPricing .table-wrap{min-height:0;overflow-x:auto}
 #materialPricing .material-buying-table{min-width:0;table-layout:fixed}
 #materialPricing .material-buying-table td:first-child{width:100%;padding:5px 10px;border-bottom:1px solid #d3dbe4}
 #materialPricing .material-buying-table tr:last-child td{border-bottom:0}
 #materialPricing .material-buying-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:8px}
 #materialPricing .material-buying-heading details{min-width:0;flex:1}
 #materialPricing .material-buying-heading summary{line-height:1.4;overflow-wrap:anywhere}
 #materialPricing .material-buying-heading summary small{display:inline;margin:0 0 0 8px;font-size:.8125rem;font-weight:400}
 #materialPricing .material-buying-heading ul{margin:6px 0 0}
 #materialPricing .material-buying-amounts{display:flex;align-items:baseline;gap:14px;white-space:nowrap}
 #materialPricing .material-buying-amounts>span{color:#5c6979}
 #materialPricing .material-buying-amounts>strong{color:#25384b;font-size:.9375rem}
 #materialPricing .material-buying-controls{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
 #materialPricing .material-price-field{display:flex;align-items:center;gap:5px;min-width:0}
 #materialPricing .material-price-field>span{font-size:.8125rem;color:#536273;white-space:nowrap}
 #materialPricing input[type=number]{width:66px;min-width:0;min-height:30px;height:30px;padding:4px 6px;border-color:#b7c3d0;background:#fff;color:#243547;border-radius:4px;box-shadow:inset 0 1px 2px #18283a08;font-size:.875rem}
 #materialPricing .material-psv-value input{width:56px}
 #materialPricing input[type=number]:focus{outline:2px solid #ef791e;outline-offset:1px;border-color:#9c602e}
 #materialPricing input:disabled{background:#edf0f4;color:#75808d;border-color:#d3d9e1}
 #materialPricing .material-quote-toggle{display:flex;align-items:center;gap:5px;white-space:nowrap;font-size:.8125rem;line-height:1.4;color:#526174}
 #materialPricing .material-effective-rate{font-size:.8125rem;line-height:1.4;color:#536273;white-space:nowrap}
 #materialPricing .material-effective-rate strong{color:#243547}
 @media(max-width:480px){
  #materialPricing .material-buying-heading summary small{display:block;margin:2px 0 0}
  #materialPricing .material-buying-amounts{flex-direction:column;align-items:flex-end;gap:2px}
 }
}

/* Keep manually entered buying prices and PSV values centred. */
#materialPricing input[data-material-buying-rate],#materialPricing input[data-material-psv]{text-align:center;appearance:textfield}
#materialPricing input[data-material-buying-rate]::-webkit-inner-spin-button,#materialPricing input[data-material-buying-rate]::-webkit-outer-spin-button,#materialPricing input[data-material-psv]::-webkit-inner-spin-button,#materialPricing input[data-material-psv]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}