body.sauces-page{--bg:#fff8f4;--card:#fff;--line:#eadbd2;--txt:#30190f;--mut:#8a7064;--accent:#ed4105;--ok:#ed4105;--inp:#fffdfa;background:var(--bg);color:var(--txt);font-size:16px;border-top:4px solid #30190f}
.sauces-page #app{max-width:1280px;padding:28px 32px 48px;margin:auto}
.sauces-page #app:before{content:'GORDAN · ПРОИЗВОДСТВО / СОУСНЫЙ ЦЕХ';display:block;color:#b13b13;font-size:11px;font-weight:800;letter-spacing:.09em;margin-bottom:12px}
.sauces-page h1{font-size:30px;line-height:1.2;letter-spacing:-.025em;margin:0}
.sauces-page #app>.top{margin:0 0 18px;gap:18px;align-items:center;flex-wrap:wrap}
.sauces-page .card{border-radius:18px;border:1px solid var(--line);padding:22px;margin-bottom:18px;box-shadow:0 5px 20px #51240b05}
.sauces-page .big{font-size:18px;font-weight:700}
.sauces-page .muted{line-height:1.5;color:var(--mut)}
.sauces-page input,.sauces-page select,.sauces-page textarea{background:var(--inp);border-color:var(--line);color:var(--txt);font-family:inherit;font-size:16px;min-height:44px;border-radius:10px;padding:10px 12px}
.sauces-page select{appearance:auto;-webkit-appearance:menulist}
.sauces-page input:focus,.sauces-page select:focus,.sauces-page textarea:focus{outline:2px solid #ed410535;outline-offset:1px;border-color:#ed4105}
.sauces-page input:disabled,.sauces-page select:disabled{opacity:1;background:#f5f1ed;color:#7a6b63}
.sauces-page input[readonly]{background:#f5f1ed;color:#7a6b63}
.sauces-page button{font-family:inherit;font-size:14px;min-height:42px;padding:11px 16px;border-radius:10px;box-shadow:none}
.sauces-page button.ok{background:#ed4105;color:#fff}
.sauces-page button.gray{background:#fff;color:#42281a;border:1px solid var(--line)}
.sauces-page button.bad{background:#fff0ed;color:#b52a1e;border:1px solid #f1ccc5}
.sauces-page button:focus-visible{outline:3px solid #ed41054d;outline-offset:2px}
.sauces-page .chips{gap:8px;margin-top:10px}
.sauces-page .chip{background:#fff;border:1px solid var(--line);color:#513426;border-radius:10px;padding:10px 15px}
.sauces-page .chip.on{background:#fff0e7;border-color:#ed4105;color:#bd3508;box-shadow:inset 0 0 0 1px #ed4105}
.sauces-page .posrow{padding:12px 0;gap:14px}
.sauces-page .posrow .nm{font-size:15px;line-height:1.4}
.sauces-page .posrow .nm small{display:block;color:var(--mut);font-size:12px;margin-top:3px}
.sauces-page .hdrrow{color:var(--mut);font-size:12px;font-weight:600}
.sauces-page .workshop-act-create{border-color:var(--line);border-radius:18px;background:#fff5ed}
.sauces-page .qcard{cursor:pointer;transition:border-color .15s,box-shadow .15s}
.sauces-page .qcard:hover{border-color:#ed410570;box-shadow:0 5px 18px #51240b0c}
.sauces-page .qcard .top{margin:0}
.sauces-page .workshop-act-date-card{display:flex;align-items:center;gap:16px}
.sauces-page .workshop-act-date-card label{margin:0;min-width:80px}
.sauces-page .workshop-act-date-card input{max-width:210px}
.sauces-page .sauce-batch-head{display:flex;justify-content:space-between;gap:20px;align-items:center;flex-wrap:wrap;margin-bottom:18px}
.sauces-page .sauce-batch-head p{margin:5px 0 0}
.sauces-page .sauce-batch-head button{width:auto;white-space:nowrap}
.sauce-batch-scroll{overflow:auto;max-width:100%;padding-bottom:8px;scrollbar-color:#d5b9a6 #fff8f4;scrollbar-width:thin}
.sauces-page .sauce-batch-scroll .ostrow{grid-template-columns:minmax(180px,1.6fr) repeat(var(--batch-count),minmax(104px,1fr) minmax(70px,.65fr));min-width:calc(240px + var(--batch-count)*190px);width:100%;gap:8px;padding:10px 0}
.sauces-page .sauce-batch-field{display:contents;margin:0}
.sauces-page .sauce-batch-field>span{display:none}
.sauce-icon{width:18px;height:18px;display:inline-block;vertical-align:middle;flex:none}
.sauces-page .sauce-batch-head button{display:inline-flex;align-items:center;gap:7px}
.sauces-page .sauce-batch-scroll .nm{position:sticky;left:0;z-index:1;background:#fff;padding:8px 16px 8px 0;line-height:1.4;box-shadow:6px 0 8px #fff}
.sauces-page .sauce-batch-scroll .nm small{display:block;color:var(--mut);font-size:12px}
.sauces-page .sauce-batch-scroll .hdrrow{background:#fff8f3;border-radius:8px;padding:10px 0}
.sauces-page .sauce-batch-scroll .hdrrow .nm{background:#fff8f3;padding-left:10px}
.sauces-page .sauce-batch-scroll input,.sauces-page .sauce-batch-scroll select{font-size:15px;min-height:44px}
.sauces-page .sauce-steps{display:flex;gap:8px;align-items:center;margin-bottom:18px;color:var(--mut);font-size:13px}
.sauces-page .sauce-steps span{padding:8px 12px;border-radius:8px;background:#f5ebe4}
.sauces-page .sauce-steps .active{color:#b53508;background:#ffede1;font-weight:700}
@media(max-width:700px){.sauces-page #app{padding:20px 14px 32px}.sauces-page h1{font-size:24px}.sauces-page .card{padding:16px;border-radius:14px}.sauces-page .posrow{gap:7px;grid-template-columns:minmax(100px,1fr) 60px 60px}.sauces-page .posrow.op4{grid-template-columns:minmax(95px,1fr) 50px 60px 50px}.sauces-page .posrow input{padding:8px 3px}.sauces-page .posrow .nm{font-size:13px}.sauces-page .sauce-batch-scroll .ostrow{grid-template-columns:110px repeat(var(--batch-count),100px 64px)}.sauces-page .sauce-batch-scroll .nm{font-size:13px}.sauces-page .sauce-batch-scroll input,.sauces-page .sauce-batch-scroll select{padding:8px 6px}.sauces-page .sauce-batch-head{gap:12px}.sauces-page #app:before{font-size:10px}.sauces-page .top button{padding:9px 12px}}
@media(max-width:700px){
 .sauces-page .sauce-batch-scroll{overflow:visible;padding:0}
 .sauces-page .sauce-batch-scroll .ostrow{grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-width:0;width:100%;gap:10px 12px;padding:16px 0}
 .sauces-page .sauce-batch-scroll .hdrrow{display:none}
 .sauces-page .sauce-batch-scroll .nm{grid-column:1/-1;position:static;padding:0 0 2px;box-shadow:none;font-size:15px;font-weight:600}
 .sauces-page .sauce-batch-field{display:flex;flex-direction:column;gap:5px;min-width:0;margin:0}
 .sauces-page .sauce-batch-field>span{display:block;font-size:12px;color:var(--mut)}
 .sauces-page .sauce-batch-field input,.sauces-page .sauce-batch-field select{width:100%;font-size:16px}
}