.hb-pack-mixes{display:grid;gap:22px;margin:0 0 8px}
.hb-pack-mix{border:0;margin:0;padding:0;min-width:0}
.hb-pack-mix legend{font-family:var(--font-display--family);font-size:26px;line-height:1.2;margin:0 0 10px;padding:0}
.hb-pack-mix__status{margin:0 0 12px;padding:10px 14px;border-radius:12px;background:#fff0d1;border:1px solid #dfc899;font-size:15px;line-height:1.45}
.hb-pack-mix.is-complete .hb-pack-mix__status{background:var(--color-sage);border-color:#86a18b}
.hb-pack-mix.is-over .hb-pack-mix__status,.hb-pack-mix__status.is-error{background:#ffe8e2;border-color:#a43d26}
.hb-pack-mix__list{border:1.5px solid #dce3dc;border-radius:14px;background:#fff;overflow:hidden}
.hb-pack-mix__row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:6px 8px 6px 16px;border-top:1px solid #e7ece6;transition:background .15s}
.hb-pack-mix__row:first-child{border-top:0}
.hb-pack-mix__row.is-picked{background:#eef6ef}
.hb-pack-mix__row label{font-size:16px;line-height:1.3;min-width:0}
.hb-pack-mix__row.is-picked label{font-weight:600}
.hb-pack-mix__stepper{display:flex;align-items:center;flex:0 0 auto;border:1.5px solid var(--color-foreground);border-radius:99px;background:#fff;overflow:hidden}
.hb-pack-mix__stepper button{width:44px;height:44px;border:0;background:transparent;color:var(--color-foreground);font-size:22px;line-height:1;cursor:pointer;transition:background .15s}
.hb-pack-mix__stepper button:hover:not(:disabled){background:var(--color-sage)}
.hb-pack-mix__stepper button:disabled{opacity:.3;cursor:default}
.hb-pack-mix__stepper button:focus-visible{outline:3px solid var(--color-foreground);outline-offset:-4px}
.hb-pack-mix__stepper input{width:40px;min-height:44px;margin:0;padding:0;border:0;border-radius:0;background:transparent;font:inherit;font-weight:600;text-align:center;color:var(--color-foreground);appearance:textfield;-moz-appearance:textfield}
.hb-pack-mix__stepper input::-webkit-inner-spin-button,.hb-pack-mix__stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.hb-pack-mix__stepper input:focus-visible{outline:3px solid var(--color-foreground);outline-offset:-3px}
.hb-pack-mixes__note{margin:0;font-size:14px;line-height:1.55}
@media(prefers-reduced-motion:reduce){.hb-pack-mix__row,.hb-pack-mix__stepper button{transition:none}}