
#cpt21{font-family:Arial,sans-serif;color:#182c3d;max-width:960px;margin:20px auto;padding:22px;border:1px solid #dce4ed;border-radius:14px;background:#fff;box-sizing:border-box}#cpt21 *{box-sizing:border-box}#cpt21 h2{margin:0 0 8px;font-size:26px}#cpt21 p{line-height:1.5}#cpt21 .sub{color:#516578;margin:0 0 22px}#cpt21 .top{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}#cpt21 label{display:block;font-size:13px;font-weight:700;margin-bottom:6px}#cpt21 input,#cpt21 select{font:inherit;font-size:15px;width:100%;min-width:0;padding:10px;border:1px solid #cbd5df;border-radius:7px;background:#fff;color:#182c3d}#cpt21 input:focus,#cpt21 select:focus{outline:2px solid #a9cdf9}#cpt21 .help{display:inline-flex;align-items:center;justify-content:center;border:1px solid #9eb2c7;border-radius:50%;height:19px;width:19px;font-size:12px;font-weight:bold;background:#eff6ff;color:#1d5caa;cursor:pointer;vertical-align:middle;margin-left:3px}#cpt21 .hint{font-size:12px;color:#536679;margin-top:5px}#cpt21 .helptext{display:none;padding:10px 12px;background:#edf5ff;border-radius:7px;margin:8px 0 0;font-size:13px;line-height:1.5}#cpt21 .helptext.show{display:block}#cpt21 .ingredients{margin-top:20px}#cpt21 .ing{display:grid;grid-template-columns:1.4fr 0.8fr 0.8fr 0.8fr 0.8fr 0.9fr auto;gap:8px;align-items:end;padding:12px 0;border-bottom:1px solid #e5eaf0}#cpt21 .ing .field label{font-size:12px}#cpt21 button.primary{background:#1766c2;color:#fff;border:0;border-radius:7px;padding:11px 15px;font-weight:700;cursor:pointer;margin-top:13px}#cpt21 button.remove{border:1px solid #d7a4a4;background:#fff;color:#a52a2a;border-radius:7px;cursor:pointer;padding:10px}#cpt21 .error{color:#b42318;font-size:13px;margin-top:5px;grid-column:1/-1}#cpt21 .results{margin-top:22px;background:#f0f5fa;padding:18px;border-radius:10px}#cpt21 .result{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid #dce6f0}#cpt21 .result:last-child{border:0}#cpt21 .result strong{white-space:nowrap}#cpt21 .selling{margin-top:20px;padding:16px;border:1px solid #dce4ed;border-radius:10px}#cpt21 .selling-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;align-items:end}#cpt21 .status{font-size:13px;font-weight:700;margin-top:10px}#cpt21 .good{color:#13734a}#cpt21 .warn{color:#9a5700}#cpt21 .note{font-size:12px;color:#576b7e;margin-top:18px}#cpt21 .muted{color:#627488}#cpt21 .section-title{margin:0 0 8px;font-size:18px}@media(max-width:750px){#cpt21{padding:15px}#cpt21 .top{grid-template-columns:1fr 1fr}#cpt21 .ing{grid-template-columns:repeat(2,minmax(0,1fr));background:#fafcfe;padding:12px;border:1px solid #e1e8f0;border-radius:9px;margin:12px 0}#cpt21 .ing .name{grid-column:1/-1}#cpt21 .ing .remove{grid-column:1/-1}#cpt21 .ing .remove button{width:100%}#cpt21 .selling-grid{grid-template-columns:1fr}#cpt21 .result{font-size:14px}}@media(max-width:430px){#cpt21 .top{grid-template-columns:1fr}#cpt21 h2{font-size:23px}}

#cpt21 .target-panel{margin:18px 0;padding:18px;border:1px solid #cbdced;border-radius:12px;background:#f8fbff}#cpt21 .target-panel h3{margin:0 0 6px;font-size:20px}#cpt21 .target-panel .explain{font-size:14px;color:#43586d;margin:0 0 14px}#cpt21 .target-head{display:flex;align-items:center;justify-content:space-between;gap:15px}#cpt21 .target-value{max-width:105px}#cpt21 .target-value input{text-align:center;font-size:20px;font-weight:bold}#cpt21 #cpt21-slider{width:100%;padding:0;margin:16px 0 5px;accent-color:#1766c2;cursor:pointer}#cpt21 .target-range{display:flex;justify-content:space-between;color:#5c6d80;font-size:12px}#cpt21 .target-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0 12px}#cpt21 .target-stat{padding:12px;border-radius:9px;background:#fff;border:1px solid #e1e8f0}#cpt21 .target-stat span{display:block;font-size:12px;color:#526679}#cpt21 .target-stat strong{display:block;font-size:22px;margin-top:5px}#cpt21 .target-bar{height:18px;display:flex;overflow:hidden;border-radius:30px;background:#e4e9ee}#cpt21 .target-bar .ingredient-part{background:#dc9749}#cpt21 .target-bar .remaining-part{background:#26876b;flex:1}#cpt21 .target-legend{display:flex;justify-content:space-between;gap:8px;margin-top:8px;font-size:12px;color:#405467}#cpt21 .target-warning{font-size:12px;color:#576b7e;margin:13px 0 0}#cpt21 .target-formula{font-size:13px;color:#43586d;margin:10px 0 0}@media(max-width:520px){#cpt21 .target-stats{grid-template-columns:1fr}#cpt21 .target-panel{padding:13px}#cpt21 .target-stat strong{font-size:20px}}

/* Compact ingredient editor: quantity and unit share a single control */
#cpt21 .ingredients{margin-top:22px}
#cpt21 .ing{grid-template-columns:minmax(145px,1.45fr) minmax(125px,1fr) minmax(125px,1fr) minmax(100px,.85fr) minmax(90px,.8fr) 36px;gap:9px;padding:10px 0;align-items:end}
#cpt21 .ing .field label{font-size:11px;line-height:1.25;margin-bottom:5px;color:#526579}
#cpt21 .ing input,#cpt21 .ing select{font-size:14px;padding:9px 8px;height:40px}
#cpt21 .ing .qtygroup{display:flex;min-width:0}
#cpt21 .ing .qtygroup input{width:60%;min-width:0;border-radius:7px 0 0 7px}
#cpt21 .ing .qtygroup select{width:40%;min-width:59px;border-left:0;border-radius:0 7px 7px 0;padding:8px 3px;background:#f5f8fb}
#cpt21 .ing .rowcost strong{display:flex;align-items:center;height:40px;font-size:14px;white-space:nowrap}
#cpt21 .ing .remove button{width:36px;height:40px;padding:0;font-size:22px;line-height:1}
#cpt21 .ing .error[hidden]{display:none}
@media(max-width:850px){#cpt21 .ing{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;background:#fafcfe;padding:12px;border:1px solid #e1e8f0;border-radius:9px;margin:10px 0}#cpt21 .ing .name{grid-column:1/-1}#cpt21 .ing .rowcost{align-self:end}#cpt21 .ing .remove{grid-column:auto}#cpt21 .ing .remove button{width:100%}}
@media(max-width:400px){#cpt21 .ing{gap:8px}#cpt21 .ing .qtygroup input{width:55%}#cpt21 .ing .qtygroup select{width:45%;min-width:51px}#cpt21 .ing .rowcost strong{font-size:13px}}
