.soap{--ink:#263c36;--muted:#556a62;--paper:#faf8f2;color:var(--ink);max-width:980px;margin:auto;font-size:1rem;line-height:1.6}.soap h2,.soap h3{margin:1.3rem 0 .7rem;line-height:1.25}.soap p{margin:.7rem 0 1rem}.soap input,.soap select,.soap button{font:inherit;box-sizing:border-box;min-width:0}.soap input,.soap select{width:100%;padding:.65rem;border:1px solid #93a99e;border-radius:.45rem;background:white;color:var(--ink)}.soap button{padding:.65rem .9rem;border:1px solid #789486;border-radius:.5rem;background:#edf4ef;color:var(--ink);cursor:pointer}.soap button:hover{background:#dcebe1}.soap small,.s-note{color:var(--muted)}.s-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem 1rem}.s-fields label{display:grid;grid-template-rows:subgrid;grid-row:span 3;gap:.35rem}.s-fields label span{align-self:end}.s-fields small{font-size:.85em}.s-oil{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1.4fr) auto;grid-template-rows:auto auto auto;gap:.35rem .6rem;margin-bottom:1rem;padding:1rem;background:var(--paper);border-radius:.7rem}.s-oil label{display:grid;grid-template-rows:subgrid;grid-row:1/span 2;gap:.35rem}.s-oil label span{align-self:end;font-size:.85em}.s-oil button{grid-row:2}.s-basis{grid-column:1/-1;grid-row:3}.s-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin:1rem 0}.s-result{background:#eff5f0;border-radius:1rem;padding:1.3rem;margin-top:1rem}.s-masses{display:flex;gap:2rem;flex-wrap:wrap}.s-masses span{display:block}.s-masses strong{font-size:1.8rem;line-height:1.4}.soap svg{width:100%;height:auto;margin-top:.6rem}.s-error{color:#a13d2e}.soap [hidden]{display:none!important}.soap details{margin:1rem 0;padding:.8rem;border:1px solid #c3d2c8;border-radius:.5rem}.soap summary{cursor:pointer;font-weight:600}.s-scale{display:flex;gap:.6rem;align-items:end;flex-wrap:wrap;margin:1rem 0}.s-scale label{max-width:15rem}.s-scale span{display:block}.s-upload{display:block;margin:1rem 0}.s-upload input{max-width:26rem}.soap :focus-visible{outline:3px solid #b77a3e;outline-offset:3px}@media(max-width:650px){.s-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.s-oil{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto auto auto auto auto}.s-oil label:first-child{grid-column:1/-1;grid-row:1/span 2}.s-oil label:nth-child(2),.s-oil label:nth-child(3){grid-row:3/span 2}.s-oil button{grid-row:6;grid-column:1/-1}.s-basis{grid-row:5}.s-result{padding:1rem}}@media(max-width:400px){.s-fields{grid-template-columns:1fr}}@media print{.soap button,.s-upload,.s-scale{display:none!important}.soap details{display:block}.s-result{break-inside:avoid}.soap input,.soap select{border:0}.soap{font-size:10pt}}

.s-oil{grid-template-columns:minmax(0,2fr) minmax(0,1fr) auto}.s-oil-details{grid-column:1/-1;grid-row:3;margin:0!important}.s-oil-details .s-basis{display:block;margin-top:.5rem}.s-oil-details .s-fields{margin-top:.8rem}.s-oil-details .s-fields label{grid-row:span 3}
@media(max-width:650px){.s-oil{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);grid-template-rows:auto auto auto auto}.s-oil label:first-child,.s-oil label:nth-child(2){grid-column:auto;grid-row:1/span 2}.s-oil button{grid-row:4}.s-oil-details{grid-row:3}.s-oil-details .s-fields label{grid-row:span 3;grid-column:auto}}

.s-print-only{display:none}
@media print{
body:has(.soap){background:white!important}
body:has(.soap) *:not(:has(.soap)):not(.soap):not(.soap *){display:none!important}
body:has(.soap) *:has(.soap){display:block!important;height:auto!important;min-height:0!important;overflow:visible!important;position:static!important;margin:0!important;padding:0!important}
.soap> :not(#sResult):not(#sPrintTitle){display:none!important}
.soap .s-print-only{display:block!important}
.soap{font-size:10pt!important;max-width:none;margin:0}
.soap .s-result{break-inside:auto;background:white;border:1px solid #9eaca5;padding:12pt;margin:0}
.soap .s-actions{display:none!important}
.soap #sBreakdown li{break-inside:avoid;overflow-wrap:anywhere}
.soap #sPrintTitle{font-size:16pt;margin:0 0 10pt}
}
