.flavor-scale{display:flex;flex-direction:column;gap:12px}.flavor-scale-scroller{display:flex;gap:12px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;padding:4px 2px 8px;margin:0 -2px}.flavor-scale-scroller::-webkit-scrollbar{display:none}.flavor-scale-card{flex:0 0 auto;width:132px;scroll-snap-align:start;display:flex;flex-direction:column;align-items:stretch;gap:6px;padding:8px;border:2px solid var(--border-ui, #CCCCCC);border-radius:var(--card-radius, 10px);background:var(--card-bg, #FFFFFF);font:inherit;text-align:left;cursor:pointer;position:relative;transition:border-color .12s ease,transform .12s ease,box-shadow .12s ease}.flavor-scale-card:hover:not(.inactive){transform:translateY(-2px);box-shadow:var(--shadow, 0 1px 3px rgba(0, 0, 0, .12))}.flavor-scale-card.selected{border-color:var(--flavor-heat, var(--main-color, #036A38));box-shadow:0 0 0 1px var(--flavor-heat, var(--main-color, #036A38)) inset}.flavor-scale-card.inactive{opacity:.45;cursor:not-allowed}.flavor-scale-card-image{display:block;width:100%;height:84px;border-radius:var(--border-radius-sm, 6px);background-color:var(--main-bg-color, #F4F4F4);background-size:contain;background-position:center;background-repeat:no-repeat}.flavor-scale-card-image.placeholder{background-image:linear-gradient(135deg,rgba(0,0,0,.04),rgba(0,0,0,.1))}.flavor-scale-card-heat{display:block;height:4px;border-radius:2px;background:var(--flavor-heat, var(--main-color, #036A38))}.flavor-scale-card-name{font-size:var(--text-body-sm, .875rem);font-weight:500;line-height:1.25;color:var(--text-primary, #000000)}.flavor-scale-card-price{font-size:var(--text-caption, .75rem);color:var(--text-secondary, #595959)}.flavor-scale-card-qty{position:absolute;top:4px;right:4px;min-width:22px;padding:1px 5px;border-radius:11px;background:var(--flavor-heat, var(--main-color, #036A38));color:#fff;font-size:var(--text-caption, .75rem);text-align:center}.flavor-scale-bar{display:flex;align-items:center;gap:10px}.flavor-scale-bar-label{font-size:var(--text-caption, .75rem);color:var(--text-secondary, #595959);white-space:nowrap}.flavor-scale-track{position:relative;flex:1;height:10px;border-radius:5px;cursor:pointer;touch-action:none;background:linear-gradient(90deg,var(--heat-1, #A1C59F) 0%,var(--heat-2, #62A176) 25%,var(--heat-3, #036A38) 50%,var(--heat-4, #F93F32) 80%,var(--heat-5, #9B0700) 100%)}.flavor-scale-track.idle{cursor:default;opacity:.55}.flavor-scale-track.idle .flavor-scale-thumb{display:none}.flavor-scale-thumb{position:absolute;top:50%;width:26px;height:26px;margin-left:-13px;transform:translateY(-50%);border-radius:50%;background:#FFFFFF;border:3px solid var(--text-primary, #000000);box-shadow:0 1px 4px #0000004d;cursor:grab;touch-action:none}.flavor-scale-thumb:active{cursor:grabbing}.flavor-scale-thumb:after{content:"";position:absolute;top:50%;left:50%;width:44px;height:44px;transform:translate(-50%,-50%)}.flavor-scale-thumb:focus-visible{outline:3px solid var(--text-primary, #000000);outline-offset:3px}.flavor-scale-recap{display:flex;flex-wrap:wrap;gap:8px;min-height:32px;align-items:center}.flavor-scale-recap-empty{font-size:var(--text-caption, .75rem);color:var(--text-secondary, #595959)}.flavor-scale-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid var(--border-ui, #CCCCCC);border-radius:var(--radius-pill, 999px);background:var(--card-bg, #FFFFFF);font:inherit;font-size:var(--text-body-sm, .875rem);color:var(--text-primary, #000000);cursor:pointer}.flavor-scale-chip-dot{width:10px;height:10px;border-radius:50%;background:var(--flavor-heat, var(--main-color, #036A38))}.flavor-scale-chip-qty{font-size:var(--text-caption, .75rem);color:var(--text-secondary, #595959)}.flavor-scale-chip-remove{font-size:1rem;line-height:1;color:var(--text-secondary, #595959)}.flavor-scale-chip:hover .flavor-scale-chip-remove{color:var(--error, #9B0700)}.flavor-scale-empty{font-size:var(--text-body-sm, .875rem);color:var(--text-secondary, #595959);padding:12px 0}@media (min-width: 768px){.flavor-scale-card{width:156px}.flavor-scale-card-image{height:100px}}