
.mix-hero{display:flex;justify-content:space-between;align-items:center;gap:28px;padding:48px 0 20px}.mix-hero h1{font-size:clamp(38px,5vw,60px)}.mix-hero .intro{margin:0;color:var(--green);font-weight:700}.mix-lead{max-width:620px;color:var(--muted)}.mix-toolbar{display:flex;flex-direction:column;gap:10px;flex-shrink:0}.label-note{border-left:4px solid var(--purple);margin:0 0 36px}.mix-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:30px;align-items:start}.sequence-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.sequence-heading h2{margin:0}.sequence-heading .eyebrow{font-size:10px}.step-total{background:#e9e0f2;color:var(--purple);border-radius:30px;padding:8px 14px;font-size:12px;font-weight:700;white-space:nowrap}.mix-steps{list-style:none;padding:0;margin:0;display:grid;gap:10px}.mix-step{background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden}.mix-step label{display:flex;align-items:center;gap:16px;padding:20px;cursor:pointer;min-height:92px}.mix-step input{width:21px;height:21px;min-height:21px;flex-shrink:0;accent-color:var(--green);padding:0}.step-number{font-size:24px;font-weight:700;line-height:1;color:var(--purple);min-width:32px}.step-copy{display:flex;flex-direction:column;gap:5px;flex:1}.step-copy strong{font-size:17px;line-height:1.3}.step-copy>span{font-size:14px;color:var(--muted)}.formulation{font-size:10px;font-weight:700;letter-spacing:.5px;color:var(--green);background:#edf5e6;padding:6px 8px;border-radius:5px}.mix-step:has(input:checked){border-color:#79a653;background:#f1f7ed}.mix-step:first-child,.mix-step:last-child{border-left:5px solid var(--green)}.mix-aside{position:sticky;top:20px}.mix-aside .panel{margin:0 0 20px}.mix-aside h2{font-size:26px}.mix-aside p{font-size:14px}.mix-aside .eyebrow{font-size:10px}.progress-text{margin-top:26px}.progress-text strong{font-size:30px;color:var(--purple)}progress{accent-color:var(--green);width:100%;height:12px}.mix-aside .small-note{font-size:12px;color:var(--muted)}.water-panel{background:#eef5e8}.reference-panel{margin-top:32px}.reference-panel summary{font-weight:700;color:var(--purple);cursor:pointer;min-height:44px;display:list-item;padding:10px 0}.reference-panel img{display:block;max-width:100%;width:449px;height:auto;margin:24px auto 0}.reference-panel p{font-size:14px;max-width:820px}
@media(max-width:800px){.mix-layout{grid-template-columns:1fr}.mix-aside{position:static;display:grid;grid-template-columns:1fr 1fr;gap:16px}.mix-hero{padding-top:30px}}@media(max-width:550px){.mix-hero{display:block}.mix-toolbar{flex-direction:row;flex-wrap:wrap;margin:20px 0}.mix-aside{display:block}.mix-step label{gap:10px;padding:15px 12px}.step-copy strong{font-size:15px}.step-copy>span{font-size:13px}.formulation{display:none}.step-number{font-size:21px;min-width:27px}.sequence-heading .eyebrow{max-width:220px}.mix-step input{width:18px;height:18px;min-height:18px}}
@media print{header,.guide-nav,.skip,.mix-toolbar,footer,.mix-aside,.reference-panel{display:none!important}body{background:white;font-size:11px}main{padding:0;max-width:none}.mix-hero{padding:0;display:block}.mix-hero h1{font-size:30px;margin-bottom:8px}.mix-hero .intro{font-size:16px}.mix-lead{margin:8px 0}.label-note{margin:12px 0;font-size:10px;padding:10px}.mix-layout{display:block}.sequence-heading{margin-bottom:10px}.sequence-heading h2{font-size:20px}.mix-steps{gap:4px}.mix-step{break-inside:avoid}.mix-step label{min-height:0;padding:8px 12px;gap:12px}.step-copy strong{font-size:12px}.step-copy>span{font-size:10px}.step-number{font-size:16px}.formulation{font-size:8px}.mix-step input{width:12px;height:12px;min-height:12px}.mix-step:has(input:checked){background:white}.eyebrow{margin-bottom:5px}}

.mix-product-group{padding:0 20px 18px;margin-top:0}.mix-product-row{margin-top:8px}.mix-step .mix-product-label,.mix-product-label{display:block;padding:0;min-height:0;font-size:12px;font-weight:700;margin-bottom:6px;cursor:default}.mix-product-control{display:flex;gap:8px;align-items:center}.mix-product-control select{width:100%;min-width:0;min-height:44px;font-size:14px;padding:10px;border:1px solid #bfc5bb;border-radius:7px;background:white;color:var(--ink)}.mix-product-control select:disabled{color:var(--muted);background:#f4f4f2}.add-mix-product{background:transparent;color:var(--purple);font-size:12px;padding:6px 0;min-height:36px}.remove-mix-product{font-size:12px;padding:8px}.mix-aside .mix-product-group{padding:0}.mix-aside{position:static}@media(max-width:550px){.mix-product-group{padding:0 12px 15px}.mix-product-control{flex-wrap:wrap}.mix-product-control select{font-size:16px}}@media print{.mix-product-group{padding:0 12px 8px}.mix-product-label{font-size:10px}.mix-product-control select{font-size:10px;min-height:24px;padding:3px}.add-mix-product,.remove-mix-product{display:none!important}}


.mix-step .mix-product-control input[type="text"]{width:100%;height:auto;min-height:44px;padding:10px 12px;border:1px solid #bfc5bb;border-radius:7px;background:white;color:var(--ink);font-size:16px;flex:1}@media print{.mix-step .mix-product-control input[type="text"]{min-height:24px;padding:3px;font-size:10px}}
